Ergebnis der swf-Datei
Der Programmcode ohne Erklärungen
Codeabschnitte, die sich nicht vom vorigen Arbeitsschritt unterscheiden, werden grau geschrieben.
// BÜHNENRECHTECK
MIT FARBE FÜLLEN UND KONTURIEREN |
Der Programmcode mit Erklärungen
Linienstil definieren
this.lineStyle(2, 0xFF0000); |
Der Linienstil wird neu definiert. Linienstärke: 2 Pixel; Linienfarbe: Rot mit dem RGB-Wert (255,0,0) = Hexadezimalwert (FF,00,00).
Variable und Wertzuweisung
Eine Variable kann man sich als eine
Schachtel mit Namen vorstellen, in die bestimmte Inhalte hineingelegt werden
können. Wenn man den Namen der Schachtel kennt, kann man später
auf deren Inhalt zugreifen.
Variablen bewahren Zustände, Informationen
aus der Vergangenheit und Gegenwart, die man in der Zukunft wieder abfragen
möchte.
Technischer gesprochen, wird durch eine Variablendefinition (Variablendeklaration)
ein bestimmter Speicherplatz im Hauptspeicher reserviert. Über den
Variablennamen wird dieser Speicherplatz angesprochen, d.h. man kann den
Inhalt abfragen bzw. einen neuen Inhalt hineinschreiben.
Bei der Variablendeklaration wird neben
dem Varaiblennamen auch der Variablentyp
festgelegt. Durch den Typ wird festgelegt, wieviel Speicherplatz reserviert
werden soll und welche Inhalte in die Schachtel gelegt werden dürfen.
Bevor ein Inhalt in die Schachtel gelegt wird (= der Variablen ein Wert
zugewiesen wird), wird geprüft, ob der Typ des Inhalts mit dem der
Variablen übereinstimmt (= type checking).
Wenn das nicht der Fall ist erfolgt eine Fehlermeldung - meist durch den
Compiler beim Übersetzen des Programms (= type
mismatch error).
Wenn bei einer Variablendeklaration ein Speicherplatz definiert wird, ist
dieser nicht "leer", denn die Bits haben auf jeden Fall den Wert
0 oder 1. Nur ist die darin enthaltene Information sinnlos (= undefined).
Man muss daher, bevor man das ersten Mal auf den Inhalt der Variablen zugreift,
dieser einen Anfangswert zuweisen (= initialisieren).
Die Speicherung eines Inhalt in einer Variablen nennt man Wertzuweisung
(assignment).
var m:Number = Stage.height/2; |
Das obige Beispiel ist eine Kombination aus Variablendeklaration mit Wertzuweisung (Initialisierung) und könnte auch so geschrieben werden:
var m:Number; m = Stage.height/2; |
Über das Schlüsselwort var wird
eine Variablendeklaration eingeleitet, gefolgt vom Varaiblennamen und dem
Typ: var name:type
Somit wurde ein Speicherplatz unter dem Namen
m reserviert, der als Inhalt Zahlen aufnehmen kann.
Im nächsten Schritt wird der Varibalen
m ein Wert zugewiesen, indem der Term
Stage.height/2 ausgewertet und das Ergebnis der Variablen
m zugewiesen wird.
/ ist der Divisionsoperator.
Die Variable m enthält jetzt
den Wert 200, das ist die halbe Bühnenhöhe.
Eine Wertzuweisung auf eine Varibale
hat die allgemeine Gestalt: var = term
wobei zuerst der Term auswertet und anschließend das Ergebnis
aus einem Zwischenspeicher (Rechenregister) auf den durch die Variable definierten
Speicherplatz übertragen wird.
Startpunkt der Kurvenlinie festlegen
this.moveTo(0, m); |
Unter Verwendung der Variablen m wird der Startpunkt der Kurvenlinie in der Mitte des linken Bühnenrandes festgelegt (0|m).
Erstes Kurvensegment zeichnen
Neben dem Zeichnen von geraden Liniensegmenten mit
lineTo() gibt es auch die Möglichkeit, mit
curveTo() Kurvensegmente zu zeichnen und diese aneinanderzuhängen.
Dabei werden in ActionScript quadratische Bézierkurvensegmente
verwendet, die jeweils durch 2 Ankerpunkte und einem dazwischenliegenden
Steuerpunkt (control vertex) definiert werden.
Das gebogene Liniensegment verläuft durch die Ankerpunkte und wird
vom Steuerpunkt "angezogen".
Die meisten anderen vektororientierten Programme (wie Freehand, Illustration, CorelDraw, 3ds max) verwenden kubische Bézierkurven, die zwei Steuerpunkte verwenden, um die Biegung zwischen zwei Ankerpunkten zu definieren.
this.curveTo(50, m-70, 100, m); |
Nachdem die Koordinate des ersten Ankerpunktes durch die momentane Position
des Zeichenstiftes bereits definiert ist ( in unserem Fall durch
moveTo()), genügt es in der curveTo-Methode
nur die Koordinaten des Steuerpunktes und des zweiten Ankerpunktes anzugeben.
In unserem Fall hat für das erste Segment der Steuerpunkt die Koordinate
(50 | m-70) und der zweite Ankerpunkt die Koordinate (100 | m).
Kurve bis zum rechten Bühnenrand weiterzeichnen
Anschließend werden die restlichen Kurvensegmente bis zum rechten
Bühnenrand gezeichnet, wobei der zweite Ankerpunkt aus dem vorhergehenden
Kurvensegment der erste des neuen Segments ist und nicht mehr extra definiert
werden muss. In der obigen Grafik sind die Steuer- und Ankerpunkte gelb
zusammengefasst, die in demselben curveTo-Methodenaufruf
verwendet werden.
Durch die abwechselnde Folge von m+70 und m-70 entsteht die gleichmäßige
Schwingung.
this.curveTo(150, m+70, 200, m); this.curveTo(250, m-70, 300, m); this.curveTo(350, m+70, 400, m); this.curveTo(450, m-70, 500, m); this.curveTo(550, m+70, 600, m); |