Einsatz des prototype-Objekts in Flash MX 2004

[Madokan]

Einsatz des prototype-Objekts in Flash MX 2004

Hi Folks,

Hier mal ein kurzes und bündiges Tutorial zum Thema Einsatz des prototype-Objekts (Fallbeispiel: MovieClip.prototype) in Flash MX 2004. Was gilt es beim Einsatz zu beachten!

Fallbeispiel (MovieClip.prototype)

MovieClip.prototype.wabbern = function(x_end, y_end, multiplikator, ratio) {    
        // Initialisierung
        if (this.sX == undefined) this.sX = 0;
        if (this.sY == undefined) this.sY = 0;    
                    
        // Berechnung
        this.sX = this.sX*multiplikator+(x_end-this._xscale)*ratio;
        this.sY = this.sY*multiplikator+(y_end-this._yscale)*ratio;
        
        // Umsetzung auf den jeweils betroffene MovieClip-Instanz
        this._xscale += this.sX;
        this._yscale += this.sY;        
};
 
// Ausführung
this.onEnterFrame = function() {
    mc.wabbern(200,200,0.8,0.7);
} 

1. Schreibweise movieclip - ist Syntaktisch nicht korrekt. Es muss, wie folgt lauten: MovieClip. In Flash 5 und MX war dies noch egal - in MX 2004 nicht!

// In Flash 5 und MX (Funktionsfähige Schreibweisen)
movieclip
MovieClip
Movieclip
 
// In Flash MX 2004 (Funktionsfähige schreibweise)
MovieClip 

2. Initialisierung - Die Initialisierung muss in Flash MX 2004 unbedingt durchgeführt werden. Wer diese, wie in Flash 5 oder MX weg lässt. Erhält für this.sX und this.sY - keine korrekten Werte bzw. den Wert NaN (Not a Number)!

Bsp.:

// In Flash 5 und MX (Funktionsfähig) in Flash MX 2004 (nicht Funktionsfähig)
MovieClip.prototype.wabbern = function(x_end, y_end, multiplikator, ratio) {                
        // Berechnung
        this.sX = this.sX*multiplikator+(x_end-this._xscale)*ratio;
        this.sY = this.sY*multiplikator+(y_end-this._yscale)*ratio;
        
        // Umsetzung auf den jeweils betroffene MovieClip-Instanz
        this._xscale += this.sX;
        this._yscale += this.sY;        
};
 
// Ausführung
this.onEnterFrame = function() {
    mc.wabbern(200,200,0.8,0.7);
} 

Hinweis
Es besteht die Möglichkeit entweder die Codezeilen zu optimieren und die Initialisierung durchzuführen oder in Flash MX 2004 unter Einstellungen für Veröffentlichungen... auf Flash 5 bzw. 6 und ActionScript 1.0 umzustellen. Die Optimierung der Codezeilen ist jedoch zu bevorzugen, da die Alternative dazu führt, dass die möglicherweise eingesetzten Flash MX 2004 Neuerungen beim veröffentlichen verloren gehen und die übrigen Bestandteile des Flash Films nicht mehr korrekt abgearbeitet werden!

Achtung
Dieser Tipp sollte nicht nur beim Einsatz des prototype-Objekts beherzigt werden, sondern ist in Flash MX 2004 auch ohne weiteres auf andere Wertebehälter, wie z.B. Variablen (Zeitleistenvariablen, etc.) und Arrays übertragbar.

3. Sauberes Scoping - Der Gültigkeitsbereich und die korrekte Zuweisung innerhalb der prototype-Methode ist zu beachten. Daher sollte man nicht, wie in zahlreichen Flash 5 Skripte auf den Einsatz von this verzichten. Dieses Schlüsselwort dient zur ordentlichen Instanzierung eines Objekts (Instanz) ist meist aus reiner Schreibfaulheit weg gelassen worden. Mit this wird auf das aktuell betroffene Objekt bzw. auf die betroffene Instanz verwiesen! Durch den Einsatz wird gewährleistet, dass die prototype-Methode auf mehr als ein Objekt bzw. eine Instanz angewendet werden kann und die zu verarbeitenden Werte der betroffenen Instanzen nicht durcheinander gewürfelt werden oder gar die falsche Instanz betroffen ist.

Bsp.:

// Ausführung der wabbern-Methode auf drei Instanzen
this.onEnterFrame = function() {
    mc.wabbern(200,200,0.8,0.7);
    mc2.wabbern(150,300,0.6,0.07);
    mc3.wabbern(170,50,0.4,0.5);
} 

Bsp.: Unsauberes Scoping

// Unsaubere Scoping - beim Einsatz von prototype führt zu einem unkontrollierbaren Verhalten!
MovieClip.prototype.wabbern = function(x_end, y_end, multiplikator, ratio) {    
        // Initialisierung
        if (sX == undefined) sX = 0;
        if (sY == undefined) sY = 0;        
                    
        // Berechnung
        sX = sX*multiplikator+(x_end-_xscale)*ratio;
        sY = sY*multiplikator+(y_end-_yscale)*ratio;
        
        // Umsetzung auf den jeweils betroffene MovieClip-Instanz
        _xscale += sX;
        _yscale += sY;  
};
 
 
// Ausführung
this.onEnterFrame = function() {
    mc.wabbern(200,200,0.8,0.7);
} 

Hinweis
Sollte das Beispiel ausgeführt werden. Wird man feststellen, dass nicht nur die MovieClip-Instanz mc vom wabbern-Effekt betroffen ist, sondern sämtliche visuellen Bestandteile des Flash Films verformt werden. Wie man sieht hat man die Kontrolle darüber, welche Instanz von der prototype-Methode betroffen sein soll, dadurch verloren!


Alternative - Einsatz von with (this) { ... }
Um den Schreibaufwand durch den Einsatz des Schlüsselworts this zu verringern, kann man auf die Anweisung with zurückgreifen.

Bsp.:

// Alternative Lösung durch Einsatz von with(this) {...}
MovieClip.prototype.wabbern = function(x_end, y_end, multiplikator, ratio) {    
    with (this) {
        // Initialisierung
        if (sX == undefined) this.sX = 0;
        if (sY == undefined) this.sY = 0;      
                    
        // Berechnung
        sX = sX*multiplikator+(x_end-_xscale)*ratio;
        sY = sY*multiplikator+(y_end-_yscale)*ratio;
        
        // Umsetzung auf den jeweils betroffene MovieClip-Instanz
        _xscale += sX;
        _yscale += sY;    
    }
};
 
// Ausführung
this.onEnterFrame = function() {
    mc.wabbern(200,200,0.8,0.7);
} 

Achtung
Bei der Initialisierung der Werte sX und sY ist unbedingt darauf zu achten, dass auf der rechten Seite der Zuweisung (des Gleicheitszeichen) this.sX bzw. this.sY steht, sonst erhält man keine auf die Instanz bezogenen sX/sY-Wertebehälter, sondern auf _level0 bezogene sX/sY-Wertebehälter. Beim Einsatz von with (this) { ... } ist dies unbedingt zu beachten! Dies gilt auch für Flash 5 und MX!


Fazit
Sollte man beim Einsatz von MovieClip.prototype in Flash MX 2004 diese drei Tipps berücksichtigen kann nichts mehr schief gehen! Man sollte diese Tipps auch für den Einsatz in Flash 5 und MX beherzigen.


Besonderheit
Die aufgeführten Tipps für MovieClip.prototype lassen sich generell auf den Einsatz des prototype-Objekt übertragen, z.B. String.prototype, Button.prototype., etc.

Be inspired!

Liebe Grüsse
Matze K.