Teil 4: Workshop: Flash Tweening mit Actionscript 2
- Workshop: Flash Tweening mit Actionscript 2
- Teil 2: Workshop: Flash Tweening mit Actionscript 2
- Teil 3: Workshop: Flash Tweening mit Actionscript 2
- Teil 4: Workshop: Flash Tweening mit Actionscript 2
Wir ersetzen die festen Werte des Linienstils durch Variablen, die vom User gefüllt und verändert werden können....
Wir ersetzen die festen Werte des Linienstils durch Variablen, die vom User gefüllt und verändert werden können.
arbeitsflaeche.lineTo(_xmouse,
_ymouse);
updateAfterEvent();
}
}
}
arbeitsflaeche.onMouseUp = function(){
delete arbeitsflaeche.onEnterFrame;
delete arbeitsflaeche.onMouseMove;
}
function loeschen() {
arbeitsflaeche.clear();
updateAfterEvent();
}Da die Buttons für die Linienstärke und die Farbe selbstständig arbeiten, brauchen wir nun nur die Steuerung und Auswertung des Alpha-Slider.
alpha_slider.slider.onPress =
function(){
delete arbeitsflaeche.onMouseDown;Sobald der Slider gezogen wird, soll nicht gleichzeitig gemalt werden.
alpha_slider.slider.startDrag
(false,-100,-28,100,-28);Hier braucht es ein wenig Fingerspitzengefühl. Ihr Y-Wert mag ein anderer sein, als "-28". Je nach Position des Reglers.
this.onEnterFrame = function(){
alpha_anzeige =
Math.round((100+alpha_slider.
slider._x)/2);
}
}Das ist die Berechnung des Alphawerts anhand der Slider-Position. Die Werte werden um 100 nach rechts verschoben, denn sie beginnen ja bei "-100". Sie werden durch zwei geteilt, weil der Alpha-Parameter nur Werte zwischen 0 und 100 kennt und sie werden zur Ganzzahl gerundet.
Ist das Verschieben des Reglers beendet, darf natürlich wieder gemalt werden. Außerdem übernehmen wir erst jetzt den endgültigen Wert in die Variable linienAlpha. Alles andere wäre überflüssig.
Achten Sie darauf, dass sie hier auch releaseOutside verwenden, denn gerade beim Ziehen eines Schiebereglers kann es ganz leicht dazu kommen, dass der Cursor aus der interaktiven Fläche herausrutscht und das Ereignis nicht mehr richtig beendet wird.
alpha_slider.slider.onRelease =
alpha_slider.slider.onReleaseOutside
= function(){
arbeitsflaeche.onMouseDown = malen;
linienAlpha = alpha_anzeige;
stopDrag()
}Programmierte Filter
Seit Flash 8 kennt Actionscript die Filtereffekte Schlagschatten, Glow oder Weichzeichnen. Die Effekte sind nicht nur einfach anzuwenden, sie können auch beliebig per Programmierung angesprochen und verändert werden.
Dabei verbraucht der fertige Film in der Regel weniger Speicherplatz, als wenn die Effekte per Tweening animiert werden. Die wenigen Zeilen Actionscript sind ebenso schnell eingefügt, wie das Tweening von Hand erstellt.
Der Rest besteht in wenigen Zeilen Actionscript. Zunächst gilt es, die Filterklassen zu importieren. Das geschieht im Moment des Veröffentlichens des Flash-Films. Sie können die einzelnen Filter importieren oder alle auf einmal, indem Sie den Platzhalter "*" verwenden.
import flash.filters.*;Nun erzeugen wir eine Variable für den GlowFilter. Die Parameter des Filters lassen sich sehr gut bei den Codehinweisen im Actionscript-Fenster ablesen.
Da wäre zunächst die Farbe, die als Hexadezimalcode angegeben wird. In Actionscript steht stets "0x" vor der Farbangabe. Dann kommt die Alpha-Deckkraft, dann die Weichzeichner in X- und Y-Richtung, dann die Stärke des Filters und dessen Qualität. "1" steht für geringe Qualität, "3" für hohe.
Zum Schluss sehen Sie noch die Flaggen für "Inneres Glühen" und für "Aussparung". Letzteres lässt nur den Glüheffekt übrig, versteckt aber das eigentliche Objekt.
var Gluehen:GlowFilter = new
GlowFilter(0xFFFFFF,80,10,10,3,3,true,false);Nun wenden wir den Filter auf den Movieclip an. Innerhalb der eckigen Klammern können auch mehrere Filter stehen.
apfel.fuellung.filters = [Gluehen];Im nächsten Schritt wird der Rollover- Effekt definiert. Er löst eine Animation aus, die die Parameter blurX und blurY so lange vergrößert, bis der Wert 30 erreicht wird.
Der Divisor 10 bestimmt die Schrittgröße, die von Runde zu Runde kleiner wird. Ein asymptotisches Annähern also, das einem Abbremseffekt entspricht.
apfel.fuellung.onRollOver =
function() {
this.onEnterFrame = function(){
Gluehen.blurX += (30-Gluehen.
blurX)/10;
Gluehen.blurY = Gluehen.blurX;Die letzte Zeile sorgt für eine proportionale Veränderung in X- und Y-Wert. In jeder Runde muss man die Ansicht auf der Bühne aktualisieren:
apfel.fuellung.filters = [Gluehen];
}
}Der Rollout-Effekt macht im Grunde das Gleiche, nur hat er als Zielwert die Ausgangs- Weichzeichner von "10".
apfel.fuellung.onRollOut =
function() {
this.onEnterFrame = function(){
Gluehen.blurX += (10-Gluehen.
blurX)/10;
Gluehen.blurY = Gluehen.blurX;
apfel.fuellung.filters =
[Gluehen];
if (Gluehen.blurX<11){
delete this.onEnterFrame;
}
}
}In ähnlicher Manier ließen sich Weichzeichner oder Schlagschatten animieren. Zum Beispiel wäre ein hübscher Buttoneffekt, wenn ein unscharfes Foto beim Rollover scharf gezogen wird.
