AS3-Tutorium: Flash: Butterfly: Unterschied zwischen den Versionen

aus GlossarWiki, der Glossar-Datenbank der Fachhochschule Augsburg
Keine Bearbeitungszusammenfassung
 
(127 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
=Zweck=
{{AS3-Tutorium:Flash:Butterfly:Menü}}


Dieses Dokument beschreibt, wie man in [[Flash 6]], [[Flash 7]], [[Flash 8]] oder [[Flash 9]] ([[Flash CS3]]) ein [[FLA]]-Dokument erstellt, in dem ein Schmetterling auf der Bühne umherflattert.
=Ziel=


Dieses einfache Flash-Movie dient dazu, erste Erfahrungen mit der [[Flash-Entwicklungsumgebung]] zu machen.
[[Datei:AS3-Tutorium Butterfly Use Cases.jpg|right|Use Cases der Tutoriums-Anwendung <code>Butterfly</code>]]
In diesem Tutorium wird beschrieben, wie man in [[Flash 10]] ([[Flash CS4]]) oder
[[Flash 11]] ([[Flash CS5]]) [[FLA]]-Dokumente erstellt, in denen ein Schmetterling auf der Bühne umherflattert.


=1. Schritt: Schmetterlingspfad erzeugen=
Diese einfachen Flash-Movies dienen dazu, erste Erfahrungen mit der [[Flash-Entwicklungsumgebung]] zu machen.
Es handelt sich im Prinzip lediglich um bessere Hello-World-Anwendungen.


# Neues Flash-Dokument erzeugen: schmetterling.fla
Die ersten drei Tutorien können auch mit [[Flash 6]], [[Flash 7]], [[Flash 8]] oder
# Ebenen anlegen:
[[Flash 9]] ([[Flash CS3]]) durchgeführt werden. Die restlichen Tutorien sollten auch mit
#* <code>Scripts</code>
Flash 9 (CS3) realisiert werden können. Dies wurde aber nicht getestet.
#* <code>Labels</code>
#* <code>Butterfly</code>
# Ebene <code>Butterfly</code> aktivieren
# Flügel malen (z.B. geeignete Farbe wählen, Freihandwerkzeug, Stiftwerkzeug, Farbeimerwerkzeug)
# Flügel kopieren (Markieren, <code>Strg-c</code>, <code>Strg-v</code>) und spiegeln (<code>Modifizieren -> Transformieren -> Horizontal spiegeln</code>)
# '''Alles selektieren, <code>F8</code> drücken => neuen Movie-Clip erzeugen, Name: <code>ButterflyMovie</code>'''
# In der Zeitleiste der Ebene <code>Butterfly</code>: Schlüsselbild weiter hinten einfügen (rechter Mausklick => <code>Schlüsselbild einfügen</code>)
# In der Zeitleiste der Ebene <code>Butterfly</code>: Tween einfügen (rechter Mausklick auf Schmetterling => je nach Flash-Version: <code>Klassisches Tween einfügen</code> bzw. <code>Tween einfügen</code> bzw. <code>Bewegungs-Tween erstellen</code>)
# Rechtsklick auf das Ebenensysmbol <code>Butterfly</code> => je nach Flash-Version: <code>Klassischen Pfad hinzufügen</code> bzw. <code>Pfad einfügen</code> bzw. <code>Pfad hinzufügen</code>
# Pfad-Ebene selektieren, Freihandwerkzeug mit Option <code>smooth</code>/<code>Glätten</code> bzw. Stiftwerkzeug => Pfad zeichnen (ohne Kreuzung)
# 1. Schmetterlingsbild: Schmetterling (Mittelpunkt) auf Pfad-Anfang legen, in Flugrichtung drehen und Größe anpassen
## Ebene <code>Butterfly</code> aktivieren
## erstes Schmetterlingsild (Frame) selektieren
## Selektionswerkzeug aktivieren
## Option <code>An Objekten ausrichten</code> bzw. <code>An Pfad ausrichten</code> aktivieren
## Flash 8: '''Shift drücken''' => Mittelpunkt rastet besser in Linie ein
## recher Mausklick => <code>Frei transformieren</code>: Schmetterling in Flugrichtung ausrichten
#  letztes Schmetterlingsbild: analog
#  in der Zeitleiste der Eben <code>Butterfly</code>: evtl. weitere Schlüsselbilder einfügen
# Schmetterling an allen Schlüsselbildern geeignet transformieren (Größe, Rotation, Alphakanal ...)


=2. Schritt: Schmetterling flattern lassen=
==Use Cases==
Im Use-Case-Diagramm wird gezeigt, was die Anwendung leisten soll:
Der Benutzer kann eine Rundenzahl eingeben und dann die Animation starten.
Die Spielfigur (ein Schmetterling) fliegt daraufhin die gewünschte Anzahl von Runden und anschließend weg.


Schmetterlingsmovie durch Doppelklick auf <code>ButterflyMovie</code> öffnen.
Beachten Sie, dass laut UML-Standard ein [[Akteur]] nur außerhalb des Systems gezeichnet werden darf.
Für Multimedia-Anwendungen mit Spielfiguren oder Avataren hat es sich jedoch als vorteilhaft
erwiesen, vom Standard abzuweichen. Eine Spielfigur (wie hier der Schmetterling) ist ein Akteur im System,
der von außen lediglich die Befehle erhält zu agieren.


Entweder Einzelbilder hintereinanderfügen oder Schmetterlingsflügel mit Hilfe eines Tweens verzerren (ohne den Schmetterlings-Mittelpunkt vom Platz zu bewegen
=Tutorium=
 
# [[AS3-Tutorium: Flash: Butterfly 01 fluttering|Flatternder Schmetterling]]  <swf width="110" height="80">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_01_fluttering_multi/Butterfly01MultiFlash11.swf</swf>
=> <code>frei transformieren</code>; Alt-Taste drücken
# [[AS3-Tutorium: Flash: Butterfly 02 path|Schmetterling fliegt auf einem Pfad]] <swf width="110" height="80">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_02_path_multi/Butterfly02MultiFlash11.swf</swf>
# [[AS3-Tutorium: Flash: Butterfly 03 fixed number of rounds|Schmetterling fliegt eine vorgegebene Anzahl von Runden]] <swf width="110" height="80">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_03_fixed_number_of_rounds_multi/Butterfly03MultiFlash11.swf</swf>
# [[AS3-Tutorium: Flash: Butterfly 04 variable number of rounds|Schmetterling fliegt eine variable Anzahl von Runden]]
# [[AS3-Tutorium: Flash: Butterfly 05 external code|Schmetterling fliegt eine variable Anzahl von Runden (externe Hauptklasse)]]
# [[AS3-Tutorium: Flash: Butterfly 06 external code|Schmetterling fliegt eine variable Anzahl von Runden (externe Hauptklasse, externe Schmetterlingsklasse)]] <swf width="226" height="160">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_04_variable_number_of_rounds_multi/Butterfly04MultiFlash11.swf</swf>
# [[AS3-Tutorium:_Flash:_Butterfly_07a_character|Schmetterling als (Spiel-)Figur]] (simple Variante)
# [[AS3-Tutorium:_Flash:_Butterfly_07b_character|Schmetterling als (Spiel-)Figur]] (verbesserte Variante)
# [[AS3-Tutorium:_Flash:_Butterfly_07c_character|Schmetterling als (Spiel-)Figur]] (vereinfachte verbesserte Variante)
# [[AS3-Tutorium:_Flash:_Butterfly_08_character|Schmetterlingsmovie als (Spiel-)Figur]]
# [[AS3-Tutorium:_Flash:_Butterfly_09_mvc|Schmetterling fliegt eine variable Anzahl von Runden]], implementiert gemäß dem [[Model-View-Controller-PParadigma|MVC-Pattern]]
# [[AS3-Tutorium:_Flash:_Butterfly_10_vclsd|Schmetterling fliegt eine variable Anzahl von Runden]], implementiert gemäß dem [[View-Controller-Logic-Service-Data-Paradigman|VCLSD-Pattern]]


=Quellen=
=Quellen=
<noinclude>
# {{Quelle|Kowarschick, W.: Multimedia-Programmierung}}</noinclude>
# [http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/ Musterlösungen (Flash CS5)]
# [http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs4/butterfly/ Musterlösungen (Flash CS4)]


*[[Kowarschick, W.: Multimedia-Programmierung]]
== [[Subversion/HowTo|SVN]]-Repository-Verweise ==
*[[Louis, Dirk; Nissen, Svend (2004): Flash MX 2004 und ActionScript]]
* [http://glossar.hs-augsburg.de/webdav/tutorium/flash_cs5/butterfly/ Musterlösungen (Flash CS5)]
 
* [http://glossar.hs-augsburg.de/webdav/tutorium/flash_cs4/butterfly/ Musterlösungen (Flash CS4)]
[[Kategorie:Flash-HowTo]]
<noinclude>[[Kategorie: AS3-Tutorium: Flash: Butterfly]][[Kategorie: Flash-Beispiel]][[Kategorie:Kapitel:Multimedia-Programmierung:Beispiele]]
[[Kategorie:Flash-Beispiel]]
</noinclude>
{{{{SITENAME}}-konformer Artikel}}

Aktuelle Version vom 14. März 2014, 12:10 Uhr

Dieser Artikel ist veraltet und wird künftig evtl. entfernt.

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: 4
(sehr gut)

AS3-Tutorium: Butterfly: Flash | Flex

Flash: Übersicht | Teil 1 | Teil 2 | Teil 3 | Teil 4 | Teil 5 | Teil 6 | Teil 7a | Teil 7b | Teil 7c | Teil 8 | Teil 9 | Teil 10

Ziel

Use Cases der Tutoriums-Anwendung Butterfly

In diesem Tutorium wird beschrieben, wie man in Flash 10 (Flash CS4) oder Flash 11 (Flash CS5) FLA-Dokumente erstellt, in denen ein Schmetterling auf der Bühne umherflattert.

Diese einfachen Flash-Movies dienen dazu, erste Erfahrungen mit der Flash-Entwicklungsumgebung zu machen. Es handelt sich im Prinzip lediglich um bessere Hello-World-Anwendungen.

Die ersten drei Tutorien können auch mit Flash 6, Flash 7, Flash 8 oder Flash 9 (Flash CS3) durchgeführt werden. Die restlichen Tutorien sollten auch mit Flash 9 (CS3) realisiert werden können. Dies wurde aber nicht getestet.

Use Cases

Im Use-Case-Diagramm wird gezeigt, was die Anwendung leisten soll: Der Benutzer kann eine Rundenzahl eingeben und dann die Animation starten. Die Spielfigur (ein Schmetterling) fliegt daraufhin die gewünschte Anzahl von Runden und anschließend weg.

Beachten Sie, dass laut UML-Standard ein Akteur nur außerhalb des Systems gezeichnet werden darf. Für Multimedia-Anwendungen mit Spielfiguren oder Avataren hat es sich jedoch als vorteilhaft erwiesen, vom Standard abzuweichen. Eine Spielfigur (wie hier der Schmetterling) ist ein Akteur im System, der von außen lediglich die Befehle erhält zu agieren.

Tutorium

  1. Flatternder Schmetterling <swf width="110" height="80">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_01_fluttering_multi/Butterfly01MultiFlash11.swf</swf>
  2. Schmetterling fliegt auf einem Pfad <swf width="110" height="80">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_02_path_multi/Butterfly02MultiFlash11.swf</swf>
  3. Schmetterling fliegt eine vorgegebene Anzahl von Runden <swf width="110" height="80">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_03_fixed_number_of_rounds_multi/Butterfly03MultiFlash11.swf</swf>
  4. Schmetterling fliegt eine variable Anzahl von Runden
  5. Schmetterling fliegt eine variable Anzahl von Runden (externe Hauptklasse)
  6. Schmetterling fliegt eine variable Anzahl von Runden (externe Hauptklasse, externe Schmetterlingsklasse) <swf width="226" height="160">http://glossar.hs-augsburg.de/beispiel/tutorium/flash_cs5/butterfly/butterfly_04_variable_number_of_rounds_multi/Butterfly04MultiFlash11.swf</swf>
  7. Schmetterling als (Spiel-)Figur (simple Variante)
  8. Schmetterling als (Spiel-)Figur (verbesserte Variante)
  9. Schmetterling als (Spiel-)Figur (vereinfachte verbesserte Variante)
  10. Schmetterlingsmovie als (Spiel-)Figur
  11. Schmetterling fliegt eine variable Anzahl von Runden, implementiert gemäß dem MVC-Pattern
  12. Schmetterling fliegt eine variable Anzahl von Runden, implementiert gemäß dem VCLSD-Pattern

Quellen

  1. Kowarschick (MMProg): Wolfgang Kowarschick; Vorlesung „Multimedia-Programmierung“; Hochschule: Hochschule Augsburg; Adresse: Augsburg; Web-Link; 2018; Quellengüte: 3 (Vorlesung)
  2. Musterlösungen (Flash CS5)
  3. Musterlösungen (Flash CS4)

SVN-Repository-Verweise