The Tween class and the Easing class

The Tween class and the Easing class (along with some other interesting classes that we will examine in future tutorials) appeared in Flash MX2004 but were poorly documented. In Flash 8 the documentation seems to be a lot more clearer. The Tween class lets you move, resize, and fade movie clips easily on the Stage.

Before using the classes you need to import them on the frame you are planning to use them. You don't need to do it but it is a lot easier instead of having to reference the class using the full path. to import the classes use the following syntax:

import mx.transitions.Tween; import mx.transitions.easing.*;

We are using a wild card("*") to specify that we want to import all the classes that are in the "easing" directory. You will see later on that there is 6 easing classes: Back, Bounce, Elastic, Regular, Strong, None. We don't need to import all of them but at the same time we don't need to worry because if we are not using some of them they won't be exported in the final SWF.

Once the classes have been imported you can create an instance of the class without having to use the full path like below (for the moment don't worry about the parameters specified when we create the Tween instance):

import mx.transitions.Tween; import mx.transitions.easing.*; myTweening = new Tween(ball_mc, "_x", Elastic.easeOut, 0, 300, 3, true);

if you don't want to import the classes you need to specify the full path to the classes like below (In that case you will need to do the same when referencing the easing class as a function parameter):

myTweening = new mx.transitions.Tween(ball_mc, "_x", mx.transitions.easing.Elastic.easeOut, 0, 300, 3, true);

The parameters

The Tween class uses the following parameters:

import mx.transitions.Tween; import mx.transitions.easing.*; myTweening = new Tween(obj, prop, func, begin, finish, duration, useSeconds);

Let's have a look at them in more details:

obj The movie clip object that the Tween instance targets.

prop A string name of a property in obj to which the values are to be tweened. Basically you can tween the same properties that you would normally tween at authoring time (_x, _y, _xscale, _yscale, _alpha ...etc)

func The easing method that calculates an easing effect for the tweened object's property values.

begin A number that indicates the starting value of prop (the target object property to be tweened).

finish A number that indicates the ending value of prop (the target object property to be tweened).

duration A number that indicates the length of time of the tween motion. If omitted, the duration is set to infinity by default.

useSeconds A Boolean value related to the value you specify in the duration parameter, which indicates to use seconds if true, or frames if false. If you set that parameter to true the duration parameter will represent seconds, if it is set to false it will represent frames; in both cases I strongly suggest you use the FPS property to dynamically set the frame rate of the animation it will smoothen the animation immensely see example below: import mx.transitions.Tween; import mx.transitions.easing.*; myTweening = new Tween(obj, prop, func, begin, finish, duration, useSeconds); myTweening.FPS = 40;

Continue to next page....