Mit Flex bietet Adobe Entwicklern ein mächtiges Framework, mit dem sie anspruchsvolle Webanwendungen erstellen können. Wie sich Flex dabei effizient einsetzen lässt, zeigt dieses Buch.
Simon Widjaja führt den Flex-Anwender in seinem Buch in wesentliche Aspekte der Flex-Technologie ein. Zugleich versetzt er ihn in die Lage, die zahlreichen Anwendungsbeispiele in eigenen Projekten einzusetzen bzw. nach seinen Wünschen zu erweitern.
Die Beispiele, die auf Version 4 von Flex basieren, decken dabei die gesamte Bandbreite der Flex-Entwicklung ab: Von Projektverwaltung mit dem Adobe Flex Builderüber die Erstellung von User Interfaces bis hin zur Datenbankanbindung via XML behandelt das Buch sämtliche Aspekte des Web Development mit Adobe Flex. Dies schließt auch das Zusammenspiel von Flex und PHP bzw. Java ein sowie Adobe AIR, die Runtime-Umgebung von Adobe, mit deren Hilfe Flex-Anwendungen offline für den Desktop erstellt werden.
Heraus kommt ein Leitfaden, der angehenden Flexern eine wirklich umfassende und vor allem praxisnahe Einführung in die Entwicklung von Webanwendungen mit Adobes Framework bietet.

8 Anpassen der Benutzeroberfläche (S. 165-166)

8.1 Einleitung

Der Flash Builder bietet zahlreiche Möglichkeiten, mit relativ wenig Zeitaufwand selbst komplexe Anwendungen umzusetzen. Besonders die Vielzahl an vorhandenen Komponenten, die das Flex-Framework zu einem großen Teil ausmachen, trägt dazu bei, dass viele wiederkehrende Problemstellungen einfach gelöst werden können. So tragen die User Interface Komponenten und die Layout-Container dazu bei, dass der Entwickler mit wenig Aufwand den Funktionsumfang der Bedienelemente nutzen und das Layout gestalten kann, ohne die eigentliche Funktionalität der einzelnen Komponenten selbst entwickeln zu müssen. Der Einsatz eben dieser Komponenten stellt den Entwickler jedoch recht schnell vor ein neues Problem: Das visuelle Erscheinungsbild (Look and Feel) der entstehenden Anwendungen ist sehrähnlich. Das einheitliche und aufeinander abgestimmte Erscheinungsbild der vorhandenen Komponenten ist zwar durchaus ansprechend und reicht für manche Anwendungen bereits aus, wenn es jedoch darum geht, individuelle Kundenwünsche umzusetzen, steht man als Entwickler früher oder später vor der Frage:

Wie passe ich das Erscheinungsbild der verwendeten Bausteine an, sodass die Anwendung den Kundenansprüchen gerecht wird, jedoch ohne einzelne Bausteine grundlegend neu zu entwickeln?

Wie Sie wahrscheinlich bereits vermutet haben, gibt das Flex-Framework auch in dieser Hinsicht dem Entwickler verschiedene Möglichkeiten und Werkzeuge an die Hand, die es ermöglichen, das gesamte Erscheinungsbild einer Anwendung an seine individuellen Ansprüche anzupassen. In diesem und dem nächsten Kapitel zeige ich Ihnen, wie Sie mit relativ wenig Aufwand durch den gezielten Einsatz von Styles und Skins Ihrer Anwendung ein individuelles Aussehen verpassen können. Dabei werden Sie neben dem Einsatz von CSS kennenlernen, wie Sie eigene Fonts einbetten, wie Sie durch das Scale9-Verfahren Grafiken für das Skinning aufbereiten und dass das Aussehen von Komponenten auch ohne den Einsatz von Grafiken programmiert werden kann. Im Rahmen von CSS hat sich im Vergleich zu Flex 3 einiges verändert. So ist aufgrund der neuen Spark-Komponenten und der Möglichkeit, die bisherigen Halo-Komponenten gleichermaßen verwenden zu können, die Notwendigkeit entstanden, diese Unterscheidung auch in CSS sichtbar zu machen. Hierzu wurden Namespaces und neue Selektoren eingeführt.


8.2 Styles

Die Eigenschaften bzw. Attribute zum Verändern des visuellen Erscheinungsbildes von Komponenten in Flex nennt man Styles. Mithilfe dieser Styles lassen sich einzelne Komponenten oder ganze Komponentengruppen innerhalb der Anwendung anpassen. So lassen sich bspw. die Hintergrundfarbe der Anwendung, die Schriftart sämtlicher Schaltflächen oder die Highlight-Colors einer ganz bestimmten Listeüber Styles verändern. Einige Style-Eigenschaften werden dabei automatisch an untergeordnete Kindelemente vererbt. Außerdem können Style-Definitionen in CSS-Klassen zusammengefasst werden, die ebenfalls voneinander erben können. Wie Sie das realisieren und welche Regeln bei der Vererbung von Style-Definitionen gelten, erfahren Sie auf den folgenden Seiten.