AS3-Tutorium: Flex: Butterfly 02 fixed number of rounds

Dieser Artikel erfüllt die GlossarWiki-Qualitätsanforderungen nur teilweise:

Korrektheit: 4 (großteils überprüft)

Umfang: 3 (einige wichtige Fakten fehlen)

Quellenangaben: 5 (vollständig vorhanden)

Quellenarten: 5 (ausgezeichnet)

Konformität: 5 (ausgezeichnet)

AS3-Tutorium: Butterfly: Flash | Flex

Flex: Übersicht | Teil 1 | Teil 2 | Teil 3 | Teil 4 | Teil 5

Dieser Artikel wird derzeit von einem Autor gründlich bearbeitet. Die Inhalte sind daher evtl. noch inkonsistent.

Flatternder Schmetterling

Im zweiten Teil des Flex-Tutoriums wird der Schmetterling aus Flash-Tutorium „Butterfly 04 variable number of rounds“ in eine Flex-Anwendung eingebunden. Im Gegensatz zum Movie-Clip Butterfly (flatternder Schmetterling) hat der Movie-Clip ButterflyMovie (Schmetterling, der in Kreis fliegt und dabei flattert) ein Attribut (roundsToFly) auf das von außen, das heißt von Flex aus zugegriffen werden kann.

<swf width="367" height="267">http://glossar.hs-augsburg.de/beispiel/tutorium/flex_4__flash_cs5/butterfly/Butterfly02Flex4Flash11/swf/Butterfly02Flex4Flash11.swf</swf> Musterlösung (Flex 4/Flash CS5) (SVN-Repository)

Musterlösung (Flex 4/Flash CS4) (SVN-Repository)

Unterschiede zu Teil1 des Flex-Tutoriums

Im Prinzip verläuft die Programmierung des Flex-Projektes Butterfly02Flex genauso wie die Programmierung des Flex-Projektes Butterfly02Flex.

Lediglich folgende Unterschiede sind zu beachten:

• Das Projekt heißt anders: Butterfly02Flex an Stelle von Butterfly01Flex.
• Anstelle der fla-Datei des Flash-Tutoriums „Butterfly 01 fluttering wird die fla-Datei Ihrer Lösung oder der Musterlösung des Flash-Tutoriums „Butterfly 04 variable number of rounds“ in Flex integriert (z.B. unter dem Namen Butterfly04Flash.fla).
• In der Bibliothek der fla-Datei Butterfly04Flash.fla werden zwei Symbole in Flex-Komponenten konvertiert: Butterfly und ButterflyMovie. (Die Flex-Komponente Butterfly wird im Weiteren gar nicht mehr verwendet, mann könnte also auch darauf verzichten, das zugehörige Symbol zur Flex-Komponente zu machen).
• Optional: In der Bibliothek der fla-Datei Butterfly04Flash.fla: Der Ordner Interaction mit dem Symbol UserInput sowie der von Flash angelegte Ordner FlashComponents können gelöscht werden. In diesem Fall müssen auch die Ebenen input und vor Allem scripts aus der Hauptzeitleiste gelöscht werden.
• Anstelle der Flex-Komponente Butterfly wird die Flex-Komponente ButterflyMovie auf die Hauptbühne gelegt (Datei Butterfly02Flex.mxml, Designmodus)

Bis hierher unterscheiden sich das Flex-Tutorium 1 und 2 nur in der Wahl der Symbole, die in Flex-Komponenten konvertiert werden. Allerdings kann jetzt auf das Attribut numberOfRounds der Komponente ButterflyMovie von außen, das heißt von Flex aus zugegriffen werden.

Folgender Code in der Datei Butterfly02Flex.mxml (Quellenmodus) sorgt dafür, dass der Schmetterling genau zwei Runden über der Bühne fliegt:

<?xml version="1.0" encoding="utf-8"?>
<s:Application
  xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" 
  xmlns:std="*"
  width="550" height="400"
  applicationComplete="init()"
>
  <fx:Script>
    <![CDATA[
      private function init (): void
      {
        stage.scaleMode=StageScaleMode.SHOW_ALL;
        
        cmp_butterfly.roundsToFly = 2;
        cmp_butterfly.gotoAndPlay("lbStart");
      }
    ]]>
  </fx:Script>
  <s:Label 
    y="27" horizontalCenter="0"
    text="Butterfly 02 (Flex 4)" fontSize="20" 
    />
  <std:ButterflyMovie id="cmp_butterfly"/>
</s:Application>

Anmerkungen

Die Hauptbühne wird in einem Flex-Web-Projekt mit Hilfe der Spark-Komponente Application definiert. In einem Flex-Air-Projekt müsste die Komponente WindowedApplication verwendet werden.

Im öffnenden Tag dieser Komponente werden vier Namespaces definiert:

• s: Der Namespace für die moderneren Spark-Komponenten (existieren seit Flex 4; setzen mindestens eine Flash Player der Version 10 voraus)
• mx: Der Namespace für die alten MX-Komponenten (existieren seit Flex 2; sollten nur noch verwendet werden, wenn es keine Spark-Komponenten als Ersatz gibt)
• fx: Der Namespace für alle nicht-grafischen Flex-Elemente, wie z.B. AS3-Scripts, CSS-Style-Anweisungen etc.
• std: Der Namespace für das Standard-Package. (Im Flash-Builder wird dafür automatisch das Kürzel ns1 vergeben, wenn das Kürzel std nicht zuvor definiert wurde.)

Die Komponente ButterflyMovie liegt im Standard-Package, da in Flash unter Eigenschaften → Klasse kein anderes Package angegeben wurde.

Quellen

• Kowarschick, W.: Multimedia-Programmierung
• Musterlösung (Flex 4/Flash CS5)
• Musterlösung (Flex 4/Flash CS4)

SVN-Repository-Verweise

• Musterlösung (Flex 4/Flash CS5)
• Musterlösung (Flex 4/Flash CS4)

Dieser Artikel ist GlossarWiki-konform.