Ärgerlich ist es nur, wenn man als Website – Besucher ein Album anschauen möchte und anschließend wieder zur Übersicht gelangen will, denn es gibt kein “Zurück Button”!

Einzige Lösung: man benutzt den Browser Back Button.
Oder man benutzt dieses kleine Workaround, um den “Zurück Button” ausschließlich auf Galerien innerhalb eines Albums anzuzeigen.

<?php foreach($_GET as $key => $value)
$url = $_SERVER['REQUEST_URI'];
$check = $_SERVER['QUERY_STRING'];
if ($url != $check) {
echo '<a href="javascript: history.go(-1)">BACK</a>';
} ?>

Das Ganze platziert man in der gallery.php von NGG am gewünschten Ort, an dem der Button erscheinen soll.
Siehe da, endlich gibt es einen “Zurück Button”.
Dieses Prinzip funktioniert allerdings nur, wenn unter den NGG – Einstellungen keine Extraseite für Album-Galerien aktiviert ist.

Unter folgenden Link gelangt ihr zur Browser Sandbox von spoon.net.

Leider muss ich alle Webentwickler welche auf einen Mac zurückgreifen (Mich inbegriffen) enttäuschen, da die Sandbox nur auf Win-Systeme funktioniert.

P.S. Evtl. kennt ihr jemanden der euch ein Win-PC leiht oder Ihr besitzt Parallels Desktop, VMware Fusion, Bootcamp oder ähnliches und installiert Win auf eurem Mac.
Ich persönlich empfehle jedoch den ersten Lösungsansatz.

Nach reiflicher Überlegung entschied ich mich dazu, den Internetauftritt neu umzusetzen. Denn er sollte allen Personen und für alle Medien zugänglich sein. Zuvor war die Webpräsenz nur als Flash-Page online, jedoch wird diese Programmiersprache nicht von allen Endgeräten unterstützt und somit entschied ich mich, etwas Neues zu schaffen.

Ich hoffe das Ergebnis findet Gefallen.

Kam die Frage schon mal auf, wie man die ViewStack bzw. die dazugehörigen Container (childs) dynamisch zu ihrer Höhe bzw. Breite anpassen kann? Standardmäßig verhält sich die ViewStack so, dass sie vom ersten Child die width und height übernimmt, falls sie selbst keine feste Größe haben sollte. Was ist aber, wenn das zweite Child eines ViewStacks jetzt größer sein sollte? Dieses wird abgeschnitten und bekommt eine Scrollbar.

Hier gibt es mehrere Lösungen: Eine ist, dass man jedem Child einer ViewStack die gleichen Abmessungen gibt, sprich width und height sind identisch, egal ob in Pixel oder Prozent der Wert angegeben wird.

Aber ganz ehrlich, diese Lösung ist doch recht unschön!

Es geht aber auch anders und diese Variante ist dazu auch noch ziemlich simpel: Der ViewStack wird einfach noch ein zusätzlicher Wert mitgeben: resizeToContent="true". Damit könnt ihr euren Childs unterschiedliche Abmessungen verpassen.

Eine Möglichkeit wäre die im mx:Style Tag direkt zu definieren. Hierzu das bsp.

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” backgroundColor=”white”>

<mx:Style>
.gradientBackground { borderStyle: applicationControlBar; fillColors: #EEEEFF, #8888AA; fillAlphas: 0.7, 0.7; highlightAlphas: 0, 0; }
</mx:Style>
<mx:VBox styleName=”gradientBackground” width=”300″ height=”300″ /> </mx:Application>

die andere Möglichkeit welche auch noch zusätzlich mehrere Möglichkeiten liefert, wäre eine eigene Klasse zu schreiben diese dann wiederrum in der MXML implementiert wird. Kurz noch zu erwähnen welche zusätzliche Möglichkeiten euch hier zu Verfügung stehen: Zusätzlich kann man zu fillColors, fillAlpha … den Verlaufstype, den Winkel des Verlaufs und beim RadialVerlauf den Mittelpunkt bestimmen

package {
import mx.skins.ProgrammaticSkin;
import flash.geom.Matrix;

public class GradientBackground extends ProgrammaticSkin {
override public function get measuredWidth():Number {
return 20;
}

override public function get measuredHeight():Number {
return 20;
}

override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
var fillColors:Array = getStyle(“fillColors”);
var fillAlphas:Array = getStyle(“fillAlphas”);
var gradientType:String = getStyle(“gradientType”);
var angle:Number = getStyle(“angle”);
var focalPointRatio:Number = getStyle(“focalPointRatio”);

// Default values, if styles aren’t defined
if (fillColors == null)
fillColors = [0xEEEEEE, 0x999999];

if (fillAlphas == null)
fillAlphas = [1, 1];

if (gradientType == “” || gradientType == null)
gradientType = “linear”;

if (isNaN(angle))
angle = 90;

if (isNaN(focalPointRatio))
focalPointRatio = 0.5;

var matrix:Matrix = new Matrix();
matrix.createGradientBox(unscaledWidth, unscaledHeight, angle * Math.PI / 180);

graphics.beginGradientFill(gradientType, fillColors, fillAlphas, [0, 255] , matrix, “pad”, “rgb”, focalPointRatio);
graphics.drawRect(0, 0, unscaledWidth, unscaledHeight);
graphics.endFill();
}
}
}

So zu guter letzte die Parameter vergeben und auf x-beliebigen Container anwenden

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="white" width="100%" height="100%" >
<mx:Style>

.gradientBackground {
backgroundImage: ClassReference(“GradientBackground”);
backgroundSize: “100%”;
gradientType: radial;
fillColors: #FFCC33, #999999;
fillAlphas: 0.2, 0.5;
angle: 45;
focalPointRatio: 8;
}
</mx:Style>

<mx:VBox styleName=”gradientBackground” width=”100%” height=”50%” />
</mx:Application>

Abhilfe verschafft und dabei ein kleines Script welches Ich auf Gordon’s Blog fand.
Erstellt ein Custom Container und fügt folgendes Script hinzu.

import mx.core.ScrollPolicy;
public override function validateDisplayList():void
{
    super.validateDisplayList();

    if(null != verticalScrollBar && verticalScrollBar.maxScrollPosition == 0
        && verticalScrollPolicy != ScrollPolicy.AUTO)
    {
        verticalScrollPolicy = ScrollPolicy.AUTO;
    }

    else if(null != verticalScrollBar)
    {
        verticalScrollPolicy = ScrollPolicy.ON;
    }
}

Unter folgenden Link könnt Ihr den Source-Code einsehen.

Flex Button mit Farbübergang

Hierfür wird nur ein kleines Script benötigt.

<?xml version=“1.0″ encoding=“utf-8″?>
<mx:Application xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“horizontal” width=“400″ height=“300″ backgroundColor=“#FFFFFF”>
<mx:Script>
<![CDATA[

[Bindable]
[Embed(source="../assets/DividerBox.png", scaleGridTop="3",
scaleGridBottom="6", scaleGridLeft="3", scaleGridRight="6")]
public var DividerBox:Class;

]]>
</mx:Script>
<mx:Container x=“{box1.width + hDivBox.x + 1}” y=“0″ width=“10″ height=“100%”
mouseEnabled=“false” mouseChildren=“false”
backgroundImage=“{DividerBox}” backgroundSize=“100%” />

<mx:HDividedBox id=“hDivBox” width=“100%” height=“100%” borderStyle=“solid”>

<mx:Box id=“box1″ width=“50%” height=“100%” backgroundColor=“#FFD0C0″>
</mx:Box>
<mx:Box id=“box2″ width=“50%” height=“100%” backgroundColor=“#C0D0FF”>
</mx:Box>

</mx:HDividedBox>

</mx:Application>

Link zur Page: http://ticore.blogspot.com