Sharing Information: Tutorial : Clock hands in Actionscript 3

Tutorial : Clock hands in Actionscript 3

12:05 AM |

Diposkan oleh Fiola |

In this tutorial you will learn how to create a moving clock hands effect in Actionscript 3. For this effect you will need an image of an analogue clock which you will need to remove the long and short hands from. You can use Photoshop or your favourite photo editor to remove the hands.

Clock hands in Actionscript 3

Step 1

Open a new AS3 file. Import the image of the clock by selecting File > Import > Import to Library. Select the Pen tool or one of the shape tools and draw the long and short hands of the clock on the stage.

Step 2

Convert the clock hands into movie clips and give them the instances names: lh_mc, and sh_mc accordingly. Double click into enter inside the movie clips and change the registration points so that they are at the correct rotating positions.

Step 3

Add the following code into the Actions panel:

//Adds the enter frame event to the stage.
stage.addEventListener(Event.ENTER_FRAME, moveHands);

//This rotates the short hand by adding two to the rotational value, and rotates the
//long hand by adding eight to the rotational value.
function moveHands(e:Event):void{
sh_mc.rotation += 2;
lh_mc.rotation += 8;
}

Step 4
Test your movie Ctrl + Enter.