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

Circle transformation

3.11.2006, 21:42    Total views: 45023

This flash tutorila will show you how to create a circle transformation, using the Action Script.



Move your mouse over the circle, to transformate it.

Step 1

Create a new flash document, choose Modify > Document (Ctrl+J) and set width to 300 and Height to 200px. Frame rate set to 24fps (Frames per Second).



Step 2


Double click on layer 1 to rename its name in background. After that, lock the background layer, insert a new layer and name it circle.

Step 3

Take the Oval Tool (O), and draw a "circle" 30x30px. See the picture below.





Step 4

Select the "circle" and press F8 key, to convert it into a Movie Clip.



Step 5

Then, select the "circle" again, open the Action Script Panel (F9), and paste this script:

onClipEvent (load) {
setProperty(this, _xscale, (300 - _root._xmouse) * 2);
setProperty(this, _yscale, (300 - _root._ymouse) * 2);
setProperty(this, _alpha, 100);
}
onClipEvent (enterFrame) {
setProperty(this, _xscale, _xscale - 10);
setProperty(this, _yscale, _yscale - 10);
if (_alpha > 4) {
setProperty(this, _alpha, _alpha - 5);
}
}

Step 6

Afte that, while your new made Movie Clip ("circle") is still selected, open the Properties Panel (Ctrl+F3), and under <Instance Name> type: circle



Step 7

Insert a new layer and name it Action. Click on frame 1, open the Action Script Panel (F9), and paste this script:

i = 0;
setProperty("circle", _visible, false);

Step 8

Click on frame 2, press F6 (keyframe), and in Action Script Panel, paste this scritp:

duplicateMovieClip("circle", "circle" + i, i);
removeMovieClip("circle" + (i-15));
if (i > 14) {
i = 0;
}
i++;

Step 9

Click on frame 3, press F6, and paste this script:

gotoAndPlay(_currentframe - 1);

Step 10

Click on frame 3 of layers circle and background and press F5 key.



Test your Movie (Ctrl+Enter)

We're done!

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

2. High-tech city animation
Total views: 274119

3. Water effect
Total views: 237426

4. Photo slide show
Total views: 221072

5. Special Picture Effect
Total views: 190868



Related links

dans le cadre de leur collection automne / hiver 2008 de la ngc, marque japonaise a ainsi une fois de plus a porter.ADIDAS TUBULAR WOMENils ont travaillé sur l'ensemble des trois pieces et # 8211; un sac fourre - tout, une valise et un porte - clés / carte de voyage.ils présentent une gamme de produits classiques.le fait qu'elles offrent a la plupart d'entre eux en orange est un bon contraste.  via honeyee.ADIDAS ORIGINALS NMDon peut s'attendre a une libération de ce produit dans les semaines a venir.ADIDAS TUBULAR SCHUHEla broderie artiste kimberly scola est parmi ceux qui participent a ce los angeles & # 8216; & # 8220; cette fete et # 8221; exposition,ADIDAS YEEZY BOOST 550 inaugurée vendredi dernier.ADIDAS EQUIPMENT 10a l'occasion de l'ouverture, en cas de scola a collaboré avec une tapisserie de 100 faux sacs fourre - tout.Adidas Adizero F50 FGces agréables rappels d'un événement,ADIDAS X PLR malheureusement, seulement deux jours de liaison.ADIDAS MESSI 16.3 ICles points saillants de & # 8220;StartAdidas Ultra Boost Uncaged cette fete et # 8221; et une liste de cas suivent l'artiste.ADIDAS ACE 16.3 TF