Macromedia Flash - Variable circle

This exercise will show you how to create a circular transformation of the circle using the Action Script.

Try hovering over the image above to see how the circle changes.

Step 1

Create a new Flash document, go to Modify > Document (Ctrl + J) and set the width to 300px, the height to 200px. Frame rate is 24fps (Frames per second).

Step 2

Double click on layer 1 and rename it to Background . Then lock the Background layer and add a new layer and name it Circle .

Step 3

Select the Oval Tool (O) and draw a circle with size 30x30px. Set the correct size for the circle by: selecting the new circle, press Ctrl + F3 and change the Properties parameter

Macromedia Flash - Variable circle Picture 1

Macromedia Flash - Variable circle Picture 2

Step 4

Select the circle you just drawn and press F8 to convert the circle into a Movie Clip .

Macromedia Flash - Variable circle Picture 3

Step 5

Continue to select the Circle layer again, open the Action Script window (F9) and enter the following script content:

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

Then select the Movie Clip ' Circle ', open Properties (Ctrl + F3) and enter the circle content for the part

Macromedia Flash - Variable circle Picture 4

Step 7

Add a new layer named Action . Click Frame 1, open the Action Script (F9) and enter the scrip:

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

Step 8

Click on Frame 2 of the Action layer> press F6 (keyframe)> open Action Script and enter the scrip:

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

Step 9

Click Frame 3 of the Action layer> press F6 key> enter the scrip:

gotoAndPlay (_currentframe - 1);

Step 10

Click on Frame 3 of Circle and Background> press F5

Macromedia Flash - Variable circle Picture 5

Press Ctrl + Enter to test the product

It is done! (Download finished products)