Der erste Beitrag zum Thema „Flex 4” zeigt den Aufbau einer Applikation. Außerdem werden z.B. folgende Fragen beantwortet: Welche Namespaces werden verwendet? Was sind die Spark-Komponenten? Können Halo-Komponenten aus Flex 3 weiterhin verwendet werden?

Um die Beispielcodes zu kompilieren, muss man das Flex SDK Build 4.0.0.5873 oder höher einsetzen, wie in Gumbo-Wochen auf www.video-flash.de beschrieben.

Ein einziger Namespace in Flex 3

In Flex 3 wird als einziger Namensraum (engl. Namespace) http://ns.adobe.com/mxml/2006 verwendet. Dieser enthält zum einen Informationen wie z.B. die Sprachversion, die Zuordnung der XML-Tags zu den Klassen oder die Zuordnung von CSS-Eigenschaften. Zum anderen definiert der Namespace auch die verwendeten Flex-Komponenten (Buttons, Canvcas, Datagrid, etc.), die bei Flex 3 "Halo" heißen.

Ein einfache Anwendung ist so aufgebaut:

XML:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. :Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
  3.    :Button />
  4. :Application>

Mehrere Namespaces in Flex 4

Der aktualisierte XML-Namespace für Flex 4 Anwendungen lautet:
http://ns.adobe.com/mxml/2009.

Er enthält weniger Informationen als bei Flex 3:

A small set of tags and attributes in this namespace are known by the compiler as special language entities (and do not map to component classes or their properties).

Die Komponenten werden nämlich in eigene Namensräume ausgegliedert. Die alten Halo-Komponenten aus Flex 3 landen in Namespace library://ns.adobe.com/flex/halo, die neuen Komponenten in Flex 4 heißen Spark und finden sich im Namespace library://ns.adobe.com/flex/spark.

Components will now be declared in their own namespaces, with the Flex 3 or 'Halo' components in a halo library namespace and the new Gumbo Spark components in a spark library namespace.

Bevor gezeigt wird, was dies für die Praxis bedeutet, zuerst eine Beschreibung der Spark-Komponenten.

Spark-Komponenten

Die neuen Spark-Komponenten können sich teilweise von Halo-Komponenten unterscheiden. So hat beispielsweise die Application-Komponente keine Eigenschaft für die Hintergrundgrafik mehr. Teilweise sind die Änderungen jedoch auch nur unter der Haube, um der neuen Architektur von Flex 4 gerecht zu werden. So gibt es z.B. einen Spark-Button und weiterhin einen Halo-Button, die sich in ihrer Funktionalität nicht unterscheiden.

(ScrnShots)">Der offensichtlichste Unterschied mit Einführung der Spark-Komponenten ist das neue Erscheinungsbild von Flexanwendungen. So ändert sich neben dem Look-and-Feel z.B. die Standardschrift auf Arial 12pt und die Default-Größen der Elemente. Die Abbildung zeigt einen Vergleich zwischen dem Flex 3 SDK (Halo, links) und Flex 4 (Spark, rechts).

Dabei wurden auch die Halo-Komponenten im Flex 4 SDK überarbeitet und an das neue Spark-Design angepasst. Somit können zukünftig Halo- und Spark-Komponenten problemlos kombiniert werden, da sie gleich aussehen. Der Nutzer sieht keinen Unterschied.

Ergänzend hierzu auch folgendes Zitat:

The Gumbo architecture is going to be built atop the same base classes used by the Halo architecture (e.g., UIComponent) […]. This means that applications written in Halo can incrementally adopt the Gumbo components without difficulty.

How-to: Eine einfache Anwendung in Flex 4

Was bedeutet dies nun in der Praxis? Das folgende Codebeispiel zeigt den Aufbau einer Flex 4 Anwendung.

XML:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. :Application name="MyDemoApp"
  3.         xmlns:fx="http://ns.adobe.com/mxml/2009"
  4.         xmlns:s="library://ns.adobe.com/flex/spark"
  5.         xmlns:mx="library://ns.adobe.com/flex/halo">
  6.  
  7.     :Button label="Button #1 (Spark)" x="0"/>
  8.     :Button label="Button #2 (Halo)" x="150" />
  9.  
  10. :Application>

Zuerst werden die Abkürzungen für die Namespaces innerhalb des Application-Tags definiert: „fx” für den allgemeinen Flex-2009-Namensraum, „mx” für die Halo-Komponenten, „s” für die Spark-Komponenten.

Nun können zwei Buttons auf der Bühne platziert. Der erste ist eine Spark-Button, der über s:Button erzeugt wird. Der zweite Button wird aufgrund des Präfix mx als Halo-Komponente erstellt. Dies zeigt, wie die verschiedenen Komponenten-Sets problemlos über das Ansprechen des Namespaces gemixt werden können. Optisch sind die beiden – wie oben bereits erwähnt - nicht voneinander zu unterscheiden.

Bestehenden Quellcode mit Flex 4 kompilieren

Man kann mit dem Flex 4 SDK selbstverständlich auch noch den alten Namespace (2006) nutzen. Somit ist sichergestellt, dass vorhandener Quellcode weiterhin kompiliert werden kann. Auf neue Funktionalitäten und Komponenten von Flex 4 muss verständlicherweise dann verzichtet werden.

Veraltet: FxApplication

Sollte jemand auf Codebeispiele stoßen, die eine Schreibweise wie FxApplication verwenden, handelt es sich um veraltete Beispiele. Vor kurzem wurde im SDK auf Dränge der Flash-Community diese Schreibweise (FxApplication, FxButton,etc.) von der oben erklärten Namespace-Lösung abgelöst.

Link: http://opensource.adobe.com/wiki/display/flexsdk/MXML+2009