Tutorial Online

AS3 Animation Tutorial Using the AS3 EnterFrame Event to Create Animation in Flash Video Tutorial

by Alberto Medalla
Lecturer, Ateneo de Manila University

You can use AS3 to add some animation to your Flash project using code. Instead of adding tweens on the timeline, youll be using AS3 to animate objects. In this ActionScript video tutorial, Ill show you a few simple examples on how to create animation in Flash using the AS3 EnterFrame event.

AS3 Animation Tutorial - Using the AS3 EnterFrame Event to Create Animation in Flash

AS3 EnterFrame Event Animation Sample Code #1
Here is the code for the first example where the circle will continue to scale up as long as the movie is running.

var growthRate:Number = 2;

circle_mc.addEventListener(Event.ENTER_FRAME, grow);

function grow(e:Event):void
{
     e.target.width += growthRate;
     e.target.height += growthRate;
}

AS3 EnterFrame Event Animation Sample Code #2
In the second example, the animation will stop when the circles size reaches 150 pixels.

var growthRate:Number = 2;
var maxSize:Number = 150;

circle_mc.addEventListener(Event.ENTER_FRAME, grow);

function grow(e:Event):void
{
     e.target.width += growthRate;
     e.target.height += growthRate;
     if(e.target.width >= maxSize)
     {
          circle_mc.removeEventListener(Event.ENTER_FRAME, grow);
     }
}

AS3 EnterFrame Event Animation Sample Code #3
In the third example, the code has been modified to make the circle grow and then shrink repeatedly.

var growthRate:Number = 2;
var maxSize:Number = 150;
var minSize:Number = 100;
var scaleMode:String = "grow";

circle_mc.addEventListener(Event.ENTER_FRAME, growShrink);

function growShrink(e:Event):void
{
     if(scaleMode == "grow")
     {
          e.target.width += growthRate;
          e.target.height += growthRate;
          if(e.target.width >= maxSize)
          {
               scaleMode = "shrink";
          }
     }
     else if(scaleMode == "shrink")
     {
          e.target.width -= growthRate;
          e.target.height -= growthRate;
          if(e.target.width <= minSize)
          {
               scaleMode = "grow";
          }
     }
}