Home | Flash AS3 Tutorials | Flash Animation Tutorials | Store

Flash ActionScript Tutorial: Loop Animation with Tween Class and one yoyo Method

The yoyo Method will instruct the tweened animation to play in reverse from its last direction of tweened objects.

Please update flash player to view this Flash ActionScript tutorial!

Flash Tutorial Content:

In previous Flash ActionScript tutorials, we used Tween Class and continueTo Method to do some interesting flash animation. In this tutorial, we use yoyo Method to do a loop animation. The yoyo Method will instruct the tweened animation to play in reverse from its last direction of tweened objects.

The finished Flash Movie of this tutorial is shown as above. By adding a yoyo Method to the tweened football, it can created a loop animation.

Flash ActionScript Codes:

//import transition classes
import fl.transitions.*;
import fl.transitions.easing.*;

//Destination location the specified movie clips will move to
var x2:Number = 420;

//Tween animation in x-axis
var tweenX:Tween = new Tween(football_mc, "x", Regular.easeOut, football_mc.x, x2, 3, true);

//Add Listener to tweenX
//Listen when the motion of tweenX FINISHED
//Will call moveMore function when motion of tweenX FINISHED
tweenX.addEventListener(TweenEvent.MOTION_FINISH, moveMore);

 

function moveMore(event:TweenEvent):void {

//Display message in Msg Box
output_txt.text = "When tweenX motion is FINISHED." + "\n" + "The motion will be played in reverse." + "\n" + "The function moveMore will be called whenever a motion is finished.";

 

//Instructs tweenX animation to play in reverse
//from its last direction
tweenX.yoyo();

}

Download Flash Source File:

Flash Source File yoyo-method-1.fla

Remarks:

This Flash ActionScript tutorial use one yoyo Method with tweened object. Actually you can use more than one yoyo Method with the tweened objectd. The next flash tutorial will use two yoyo Methods with the tweened object..