Advertise About Tech Consultations Write for Us Contact

Creating Timer in Action Script 3

By Rafiq Elmansy (admin)   |   June 30, 2008   |   Posted in Flash   |   View Comments  
→ Photoshop 3D for Animators: The complete guide to learn 3D and animation in Photoshop CS5. Pre-order this book now and receive a %22 discount here

Creating Timer in Action Script 3

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

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: , ,


About Rafiq Elmansy (admin)

Rafiq Elmansy is a graphic designer and runs his own design studio Pixel Consultations. He is also an Adobe Community Professional, Certified Expert and Adobe user group manager. He is a Friend of Icograda (the International Council of Graphic Design Associations). You can read his writings on Adobe site, Adobe Edge magazine, communitymx.com and his own blog www.graphicmania.net. He can also be followed on Twitter @rafiqelmansy

Enter your email to receive updates:

View Comments to “Creating Timer in Action Script 3”

  • thanks !! very helpful post!

Post comment

blog comments powered by Disqus

Subscribe without commenting

Follow on Twitter Subscribe: RSS | Email


 


 

 

Enter your email to receive email alerts of new posts and fresh free resources .

Pages

 

 


Resources News

  • Create a Vibrant and Eye-Catching Drink Compositio…August 18, 2010

    In this Photoshop tutorial, you’ll learn how to create a Sobe fruit drink advertisement using some simple water stock images and a lot of easy to use techniques that will yield high quality resul…

  • 25 FREE HIGH QUALITY VECTOR FILESAugust 18, 2010

    We would like to proudly introduce you to Vectorious.net. Vectorious is a great resource for finding royalty free stock vector images. Currently they offer over 12055 vector image files available f…

  • Logo Design: 80+ Beautiful ExamplesAugust 18, 2010

    It has been almost four months since my last post on logo design. Since then I have assembled an amazing collection of fresh new creative logos for you to be inspired by. I am confident that these …

  • Poster Art – Reminiscence Down the History LaneAugust 18, 2010

    Poster art is one of the most well-defined forms of art that has a rich historical background that involves a number of famous artists throughout the world. Ranging from advertising campaigning to …

  • The Complete Beginner’s Guide to User Script…August 18, 2010

    A user script is code written in a programming language that allows you to control a piece of software.

 

Useful Links

 
 


Graphic Mania on Facebook