AS3-Tutorium: Flash: Butterfly 02 path

zurück zur Übersicht

Schmetterling fliegt auf einem Pfad

Beispiels-Implementierung:

• butterfly_02_path (Flash CS5, SVN-Repository)
• butterfly_02_path (Flash CS4, SVN-Repository)

<swf width="367" height="267">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_02_path/multi/butterfly_02_path_multi.swf</swf>

Schmetterlingsmovie erstellen

1. In der Bibliothek: Klick auf rechte Maus-Taste → Neues Symbol → Name: ButterflyMovie
2. Symbol ButterflyMovie in den Ordner ButterflyAssets verschieben
3. In der Bibliothek: Doppel-Klick auf Icon vor dem Namen ButterflyMovie ⇒ Auf der Bühne wird ButterflyMovie geöffnet
4. Ebenen benennen:
   • butterfly
   • boundingBox
5. Ansicht → Lineale aktivieren, evtl. auch Ansicht → Raster → Raster einbelnden
6. Hilfslinien für Bühnenränder zeichnen (einfach in entsprechendes Lineal klicken, Maus-Taste gedrückt halten und Linie auf die Bühne ziehen)
7. Ebene boundingBox aktivieren
8. Rechteck zeichnen entlang der Hilfslinien zeichnen (damit später nicht die Bounding Box des Schmetterlings an dessen Startposition angezeigt wird, sondern die Bounding Box dieses Rechtecks)
9. Rechteck in ein Symbol mit Namen BoundingBox umwandeln (Rechteck selektieren, Taste F8)
10. Rechteck unsichtbar machen: Rechteck selektieren → Eigenschaften → Farbeffekt → Stil: Alpha → Wert 0%
11. Ebene butterfly aktivieren
12. Symbol butterfly auf die Bühne ziehen, positionieren und auf die gewünschte Große skalieren

Fliegen mit „modernen“ Tweens (ab Flash 10)

1. In der Zeitleiste der Ebene Butterfly: Bild bei Frame 150 einfügen (rechter Mausklick → Bild einfügen)
2. In der Zeitleiste der Ebene Butterfly: rechter Mausklick auf Balken in der Zeitleiste → Bewegungs-Tween erstellen
3. Sicherstellen, dass der Abspielkopf noch bei Frame 150 steht
4. Klick auf das Icon Auswahlwerkzeug (V) (erstes Icon von oben in der Werkzeugleiste)
5. Schmetterling an andere Position auf der Bühne ziehen
6. Den entstehenden Pfad mit Mauszeiger anfassen und verbiegen
7. Den Pfad weiter gestalten (Kopf an andere Position schieben und dann Schmetterling verschieben, mit dem Unterauswahlwerkzeug (A) Schlüsselbilder bearbeiten, mit Hilfe des Bewegungs-Editor weitere Einstellungen vornehmen); für den später zu definierenden Rundflug wird ein Pfad benötigt, bei dem Anfang und Ende sehr nahe beieinander liegen
8. Den Schmetterling in Pfadrichtung ausrichten (Pfad mit Auswahlwerkzeug (V)v selektieren → Eigenschaften → Häckchen vor An Pfad ausrichten)

Fliegen mit „klassischen“ Tweens (ab Flash 6)

1. In der Zeitleiste der Ebene Butterfly: Schlüsselbild bei Frame 150 einfügen (rechter Mausklick → Schlüsselbild einfügen)
2. In der Zeitleiste der Ebene Butterfly: Tween einfügen (rechter Mausklick auf einen Frame vor' Frame 150 → je nach Flash-Version: Klassisches Tween erstellen bzw. Tween einfügen)
3. Rechtsklick auf das Ebenensysmbol (links neben der Zeitleiste) Butterfly → je nach Flash-Version: Klassischen Pfad hinzufügen bzw. Pfad einfügen bzw. Pfad hinzufügen
4. Pfad-Ebene selektieren
5. Freihandwerkzeug mit Option smooth/Glätten bzw. Stiftwerkzeug → Pfad zeichnen (ohne Kreuzung); für den später zu definierenden Rundflug wird ein Pfad benötigt, bei dem Anfang und Ende sehr nahe beieinander liegen
6. Erstes Schmetterlingsbild: Schmetterling (Mittelpunkt) auf Pfad-Anfang legen, in Flugrichtung drehen und Größe anpassen:
   1. Ebene Butterfly aktivieren
   2. Erstes Schmetterlingsild (Frame) selektieren
   3. Selektionswerkzeug aktivieren
   4. Option (Eigenschaften-Inspektor): An Objekten ausrichten bzw. An Pfad ausrichten aktivieren
   5. Flash 8: Shift drücken ⇒ Mittelpunkt rastet besser in Linie ein
   6. Recher Mausklick → Frei transformieren: Schmetterling in Flugrichtung ausrichten
7. Letztes Schmetterlingsbild: analog
8. In der Zeitleiste der Ebene Butterfly: evtl. weitere Schlüsselbilder einfügen
9. Schmetterling an allen Schlüsselbildern geeignet transformieren (Größe, Rotation, Alphakanal ...)

Schmetterlingsmovie testen

1. Auf Szene 1 in der linken oberen Ecke der Bühne klicken
2. Symbol ButterflyMovie auf die Bühne ziehen
3. Film mit Strg-Return (Ctrl-Return) starten

• Kowarschick, W.: Multimedia-Programmierung

Dieser Artikel ist GlossarWiki-konform.