Creating Timer in Action Script 3

• Tweet

• Tweet

Introduction

In this brief article, I will show how to use the Timer in Action Script 3 to create simple animation. The Timer Event in Action Script3 enables you to repeat an action every specific time period. However, we will use this event to create the animation of a sonar point that moves through the stage.

Requirements:

Adobe Flash CS3 professional

• Try
• Buy

Sample files.zip

To complete this tutorial, you will need basic knowledge of using Adobe Flash CS3 Professional.

Create the sonar point movie clip:

First, we will create a movie clip that includes inside it an animation of a sonar point moves up and down to mimic the real animation on the sonar screen as following:

1- Create a green cycle and convert it into movie clip “Cycle”. You can add a glow filter to mimic how it looks on a real sonar screen.

2- Create another movie clip “cycle_mc” and inside it, make an animation of the cycle moves up and down.

3- Create a new layer and name it Action Script and add stop(); action to make the movie stop in the first frame.

4- In the main stage, add cycle_mc movie clip on the left of the stage and give it an instance name “ animation_mc”.

Writing the Timer code

Now we will write the code for the Timer event and see how the animation will be accomplished.

1- Open a new layer and name it “Action Script”.

2- Press F9 to access the Action Script panel.

3- First we will define a new timer variable and name it “ jumpTimer” as the code below:

var jumpTimer:Timer = new Timer(50);

When The “50″ value is The delay, in milliseconds.

4- Now, we will add an event listener to the jumpTimer and make it call a function named “jump” with the following code:

jumpTimer.addEventListener( TimerEvent.TIMER, jump);

5- And the function that will be called is the handler for the event that will occur, which is playing the animation inside the movie clip “cycle_mc” and moving the it on the stage by incremented 10 pixles as following:

function jump(event:TimerEvent):void {
animation_mc.play();
animation_mc.x +=10;

6- In the end, we will add a code that will tell the timer to start counting and executing the function

jumpTimer.start();

7- Press CTRL + Enter to test your movie.

Where to go from here

This small tutorial is to show how animators can benefit from the Action Script capabilities to create animation with less size, memory saving and easy to edit.

Tags: Action Script 3, Action Script 3 tutorials, How-to

Category: Flash tutorials