Animation Sequence with as3

Question

I am stuck at a point, where i want to do a sequence of animation being performed in Flash AS3. I am able to animate my movieclips with the TweenClass, but not able to make them play after one another in a sequence.

I want to make the closeTween to play after the evntInTween has completed playing.

The code which I am using is:

import fl.transitions.Tween;
import fl.transitions.easing.*;
import fl.transitions.TweenEvent;





BtnEvent.buttonMode = true;
BtnEvent.addEventListener(MouseEvent.ROLL_OVER, EventOver);
BtnEvent.addEventListener(MouseEvent.ROLL_OUT, EventOut);
BtnEvent.addEventListener(MouseEvent.CLICK, EventClick);


 function EventOver(event:MouseEvent) {
    event.target.gotoAndPlay(2);
}

 function EventOut(event:MouseEvent) {
    event.target.gotoAndPlay(11);
}


 function EventClick(event:MouseEvent) {
  var evntInTween:Tween = new Tween(eventzmov, "y", Strong.easeOut, 463.75, 1794.6, 3, true);


  var closetween:Tween = new Tween(closeevent, "alpha", Strong.easeOut, 0, 1, 3, true);



}

score 0 · Accepted Answer · answered Nov 20 '12 at 10:10

I think you should nest tweens, so that the second tween is created only after the first one stops playing - it sends fl.transitions.TweenEvent.MOTION_FINISH event after it ends, so you assign a listener to your button to listen to it, don't forget to drop once it will no longer be needed.

function EventClick(event:MouseEvent) {
    var evntInTween:Tween = new Tween(eventzmov, "y", Strong.easeOut, 463.75, 1794.6, 3, true);
    event.target.addEventListener(TweenEvent.MOTION_FINISH,startSecondTween);
    evntInTween.start();
}
function startSecondTween(e:TweenEvent):void {
    var closetween:Tween = new Tween(closeevent, "alpha", Strong.easeOut, 0, 1, 3, true);
    event.target.removeEventListener(TweenEvent.MOTION_FINISH,startSecondTween);
    closetween.start();
}

}

score 0 · Answer 2 · answered Nov 20 '12 at 11:52

I would highly recommend switching to the Tweening library TweenLite (aka TweenMax) by greensock. Using syntax like:

//TweenLite.to(objectToTween, timeToTween, {propertyOne:value, propertyTwo:value, onComplete: functionToCallWhenFinished});
TweenLite.to(object, 4, {y:50, alpha:0, onComplete:finishedTween, ease:Quad.easeOut});

TweenMax (the more feature rich verison of TweenLite) also has a TimeLine class for programming complex animations in a few lines of code.

https://www.greensock.com/tweenmax/

Animation Sequence with as3

2 Answers2