About Continuing Animations
About Continuing Animations
What if you want to move the ball after the initial animation completes? There are at least two ways you can handle this. The first, and perhaps the most obvious solution, is to re-animate the ball using the onMotionFinished
event handler function. While this solution works, the Tween class offers a simpler solution: the continueTo()
method. The continueTo()
method instructs the tweened animation to continue from its current value to a new value. You can see this in the following ActionScript:
import mx.transitions.Tween;
import mx.transitions.easing.*;
var ball_tween:Object
= new Tween(ball_mc, "_x", Regular.easeIn, 0, 300, 3, true);
ball_tween.onMotionFinished = function() {
ball_tween.continueTo(0, 3);
};
After the initial tween finishes, the ball_mc
movie clip tweens back to its original position at 0 pixels. You can see the function prototype for the continueTo()
method in the following snippet (edited for space):
function continueTo (finish:Number, duration:Number):Void {
/* omitted to save space. */
}
There are only two arguments that pass to the continueTo()
method, instead of the seven arguments for the Tween
method, as seen in the following snippet:
function Tween (obj, prop, func, begin, finish, duration, useSeconds) {
/* omitted to save space. */
}
The five missing arguments (obj
, prop
, func
, begin
, and useSeconds
) in the continueTo()
method use the arguments that you defined earlier in the call to the Tween class. When you call the continueTo()
method, you assume the obj
, prop
, func
(easing type), and useSeconds
arguments are the same as in the earlier call to the Tween class. The continueTo()
method uses the finish
value from the call to the Tween class, instead of specifying a value for the begin
argument.
But what does this all mean? Take another look at the following ActionScript:
import mx.transitions.Tween;
import mx.transitions.easing.*;
var ball_tween:Object
= new Tween(ball_mc, "_x", Regular.easeIn, 0, 300, 3, true);
ball_tween.onMotionFinished = function() {
ball_tween.continueTo(0, 3);
};
This code moves the ball_mc
instance along the X-axis from 0 pixels to 300 pixels in three seconds. After the animation finishes, the onMotionFinished
event handler triggers and calls the continueTo()
method. The continueTo()
method tells the target object (ball_mc
) to proceed from its current position and animate for three seconds along the X-axis to 0 pixels, and to use the same easing method. You use the values that you specify in the earlier call to the Tween constructor for any parameters that you don’t define in the continueTo()
method. If you don’t specify a duration for the continueTo()
method, it uses the duration
you specify in the call to the Tween constructor.
Comments