Flash tutorials
Home 3D (2) Actionscripting (65) Animation (100) Audio (4) Drawing (7) Full flash sites (4) Getting Started (15) Navigation (25) Special Effects (52) Text Effects (38)

Cogwheel animation

31.10.2006, 19:13    Total views: 44119

In this tutorial, you have a chance to learn how to create cogwheel animation in flash 8 using the Action Script.You will also learn how to convert "cogwheels" into a Movie Clip Symbol, how to rotate it and more.



Step 1

Create a new flash document, choose Modify > Document and set Width to 300 and Height to 250px. Frame rate set to 22fps (Frames per Second).





Step 2


Double click on layer 1 to rename its name in background. Insert a new layer and name it cogwheel. Then, draw a two cogwheels like it is shown on the picture below.



Step 3

Select the cogwheels and press F8 key (Convert to Symbol) to convert it into a Movie Clip.



Step 4

Double click on a new made Movie Clip (cogwheels), or choose right click and Edit in Place.

Step 5

Select only the one cogwheel, press Ctrl+X key (Cut), insert a new layer (layer 2), select it and press Ctrl+Shift+V (Paste in Place).

Step 6

Select the first layer, and convert the first cogwheels into a Movie Clip.



Step 7

Click on frame 40 and press F6 key (Keyframe). After that, go back on the first frame, open the Properties Panel (Ctrl+F3), under Tween choose Motion and under Rotate choose CW. See the picture below.





Step 8

Select the layer 2 and press F8 key, to convert the second cogwheel into a Movie Clip.



Step 9

Click on frame 40 and press F6 key. Then, open the Action Script Panel (F9) and paste this script:

gotoAndPlay(1);

Step 10

Select the first frame, open the Properties Panel (Ctrl+F3), under Tween choose Motion and under Rotate choose CCW. Look at the picture below.





We're done!

Test your Movie (Ctrl+Enter).

Bye!

Download source file (.fla)

Have questions about this tutorial?
Visit our friendly Community Forums!
Digg it! Add this tutorial to del.icio.us! Furl it! Add this tutorial to reddit! Spurl it! Add this tutorial to technorati!

Top tutorials

1. Advanced full flash site - Part 1
Total views: 221536

2. Water effect
Total views: 166042

3. Photo slide show
Total views: 153641

4. High-tech city animation
Total views: 151459

5. Special Picture Effect
Total views: 146247

Related links