Ergebnis der swf-Datei

Der Programmcode mit Kommentar ohne Erklärungen

Kommentare sind im nachfolgenden Code grau geschrieben.

// ZEICHNEN EINER WELLENLINIE, DIE SICH VOM OBEREN BÜHNENRAND NACH UNTEN BEWEGT /* Zeichnen der Wellenlinie in einem eigenen neuen Movieclip welle_mc */ createEmptyMovieClip("welle_mc", this.getNextHighestDepth()); welle_mc._x = 0; welle_mc._y = 0; curve(welle_mc, baseCurve, [0, 0], Stage.width, 100, 100, 1, 0xFF0000); /* Bewegen der Kurve vom oberen zum unteren Bühnenrand Die Geschwindigkeit hängt von der Bildrate des Mainmovies ab. */ this.onEnterFrame = function() {    welle_mc._y += 5; }; /* Definieren der Funktion curve(), Kurve mit Parametern Input: mc, Movieclip in dem die Kurve gezeichnet wird       bc, Funktion der Basiskurve       pt, Ausgangspunkt der Gesamtkurve       l, eine ganze Zahl - Länge der Gesamtkurve       a, eine ganze Zahl - Breite des Basiskurvenabschnitts       b, eine ganze Zahl - Höhe des Basiskurvenabschnitts       lineWidth, eine ganze Zahl - Strichstärke       lineColor, eine Hexadezimalzahl - Linienfarbe Output: - */ function curve(mc:MovieClip, bc:Function, pt:Array, l:Number, a:Number, b:Number, lineWidth:Number,                lineColor:Number):Void {    mc.lineStyle(lineWidth, lineColor);    mc.moveTo(pt[0], pt[1]);    while (l>0) {       pt = bc(mc, pt, a, b);       l = l-a;    } } /* Definieren der Funktion baseCurve(), Basiskurve mit Parametern Input: mc, Movieclip in dem die Kurve gezeichnet wird       pt, Ausgangspunkt der Kurve       a, eine ganze Zahl - Breite des Kurvenabschnitts       b, eine ganze Zahl - Höhe des Kurvenabschnitts Output: Endpunkt der Kurve */ function baseCurve(mc:MovieClip, pt:Array, a:Number, b:Number):Array {    mc.curveTo(pt[0]+a/4, pt[1]-b/2, pt[0]+a/2, pt[1]);    mc.curveTo(pt[0]+3*a/4, pt[1]+b/2, pt[0]+a, pt[1]);    pt[0] = pt[0]+a;    return pt; }

Der Programmcode mit Erklärungen

Neudefintion der Funktion curve() und Ausgangskurve zeichnen

Die Funktion baseCurve hat sich gegenüber dem vorigen Arbeitsschritt nicht verändert.
Mit createEmptyMovieClip wird ein neuer Movieclip mit dem Namen welle_mc in der nächste freien Tiefenebene erzeugt und im Ursprung des Mainmovies plaziert. Von dort ausgehend wird die Wellenlinie gezeichnet.

createEmptyMovieClip("welle_mc", this.getNextHighestDepth()); welle_mc._x = 0; welle_mc._y = 0; curve(welle_mc, baseCurve, [0, 0], Stage.width, 100, 100, 1, 0xFF0000);

Die Funktion curve wurde gegenüber dem vorigen Arbeitsschritt etwas verändert:
Es wurde ein zusätzlicher Parameter l für die Gesamtbreite der Kurve eingeführt. Die Basiskurve mit der Breite a wird über eine while-Schleife so oft nebeneinandergesetzt bis die Gesamtbreite erreicht ist. Dazu wird am Ende des Schleifenkörpers von der verbleibenden Gesamtbreite die Breite der Basiskurve abgezogen l = l-a

function curve(mc:MovieClip, bc:Function, pt:Array, l:Number, a:Number, b:Number, lineWidth:Number,                lineColor:Number):Void {    mc.lineStyle(lineWidth, lineColor);    mc.moveTo(pt[0], pt[1]);    while (l>0) {       pt = bc(mc, pt, a, b);       l = l-a;    } }

Im Funktionsaufruf von curve wird dem Parameter l die Bühnenbreite Stage.width übergeben.

curve(welle_mc, baseCurve, [0, 0], Stage.width, 100, 100, 1, 0xFF0000);

Bewegen der Kurve vom oberen zum unteren Bühnenrand mit dem Event-Handler onEnterFrame

Wenn eine swf-Datei im Shockwave-Player abgespielt wird, so werden die einzelnen Frames der Movieclips in der vordefinierten Bildrate angezeigt (in unserem Fall mit 12 Frames pro Sekunde). Jedesmal wenn der Abspielkopf in der Timeline eines Movieclips in ein neues Frame oder, wenn nur ein Frame vorhanden ist, in dasselbe springt, wird das Ereignis EnterFrame ausgelöst.
Man kann nun für einen Movieclip eine Funktion definieren, die bei Eintreten dieses Ereignisses aufgerufen wird, indem diese Funktion dem Event-Handler onEnterFrame zugewiesen wird.
Event-Handler beginnen mit dem Präfixon . Auch wenn man eigene Event-Handler definiert, sollten diese mit on... beginnen.

this.onEnterFrame = function() {    welle_mc._y += 5; };

Im obigen Fall wurde dem Event-Handler onEnterFrame des Mainmovies (das Script steht in der Timeline des Mainmovies und daher wird mit this das Mainmovie bezeichnet) ein Funktionsliteral zugewiesen. (Informationen über Funktionsliterale findet man im 9. Arbeitsschritt der Übung Einführung in die Programmierung mit ActionScript.)
Im Funktionskörper wird die y-Koordinate des Movieclips welle_mc um 5 erhöht und somit nach unten bewegt.
welle_mc._y += 5 ist eine Abkürzung für welle_mc._y = welle_mc._y + 5

Man könnte den obigen Codeabschnitt auch folgendermaßen schreiben:
Zuerst wird eine benannte Funktion ohne Ein- und Ausgabeparameter definiert und anschließend wird der Funktionsname dem Event-Hanlder zugewiesen.

function moveCurve():Void {    welle_mc._y += 5; }; this.onEnterFrame = moveCurve;

Sobald ein Funktionsliteral oder eine Funktion dem Event-Hanlder zugewiesen wurde, wird bei Eintreten des Ereignisses der Anweisungsblock der Funktion abgearbeitet. In unserem Fall würde sich die Kurve solange (auch außerhalb der Bühne) nach unten bewegen, bis die Ausführung der swf-Datei beendet wird.

Bei dieser Art der Bewegungssteuerung ist die Geschwindigkeit von der Bildrate des Mainmovies abhängig. Bei 12 Frames pro Sekunde bewegt sich die Kurve um 12*5 Pixel pro Sekunde nach unten.
Später werden wir eine Bewegungssteuerung, die von der Bildrate unabhängig ist, besprechen.

Alternative Definition des Event-Handlers onEnterFrame

Man definiert den Event-Handler onEnterFrame nicht für das Mainmovie, sondern für den Movieclip welle_mc.

welle_mc.onEnterFrame = function() {    this._y += 5; };

In diesem Fall reagiert der Event-Handler auf Ereignisse in der Timeline des Movieclips welle_mc. Im Funktionskörper muss daher this stehen, weil sich der Movieclip "selbst" bewegt.