Flash Example Teaching: A special effect of the production

This article will lead you together, through the ActionScript script in Flash programming, to achieve the festival fireworks animation. At the beginning of the fireworks will appear three-dimensional animation, and then gradually fall and disappear fireworks, very beautiful.

Animation effect:

Click here to download the source file

Step one: Launch Flash MX 2004 Chinese (hereinafter referred to as Flash) and create a new flash blank document. On the following property panel, click the Color button to the right of background to set the background color to black.

Step two: Press Ctrl+f8 to open the Create New Symbol dialog box, the symbol named "Grastar", "Behavior" select "Graphics", and then enter the component editing window. Set the stroke and fill color to white, and then use the Oval tool to draw a two-crossed slender oval, and then use the Pencil tool for a little modification to get the star graph shown in Figure 1.

Step three: Press Ctrl+f8 to open the Create New Symbol dialog box, name the symbol "Mvcstar", "Behavior" select "Movie clips", and then enter the component editing window. Press Ctrl+l to bring up the library panel and drag the Grastar from the library panel to the Mvcstar Component editing window. Click Frame 9th, and then press F6 to insert a keyframe, in the same way, at 10th, 25 frames, respectively. Click on Frame 1th, the "tween" item is then set to action in the Properties panel, the Rotate item is set to clockwise, and the number is 1, when frame 1th through 9th becomes blue and a line with an arrowhead is displayed, indicating that the motion tween was set successfully. Click on frame 25th, move the star graph down a certain distance (you can press shift+ down ARROW keys to adjust), and then use any transform tool (shortcut key to Q) to reduce the size of the star, and then click the Properties panel on the Color Drop-down button, select the "Alpha" item, Then, on the right, the opacity of the color is set to 0, so that the stars have a gradual drop and disappear animation effect. Click the 10th frame and set the tween to action in the Properties panel.

The fourth step: click on Frame 25th, clicking the "Action-frame" panel below, fill in the following script statement in the right window. The last timeline effect is shown in Figure 2.

Stop ();
_root.gotoandplay (1); Jump to the main timeline and play frame 1th

Step Fifth: Click "Scene 1" on the top edit bar to return to the main scene and drag and drop the Mvcstar movie clip to the scene (so that you don't see the Mvcstar when you play). Click the Mvcstar instance to name the instance name Itnstar in the properties panel for later use in the program design. Right-click Frame 2nd and select the Insert blank Frame command. Then, click on Frame 1th and expand the action-frame panel below, and write the following script code in the edit window to the right, along with a comment of more than 20 lines, very simple. Note that the number ordinal in front of the statement is added for convenience, and do not enter the numbers when you enter the code. When you enter the code, hold down the CTRL key and enter, and you can enjoy the festive fireworks that you have programmed (see Figure 3). In the next section, you'll dissect the meaning of the code in detail.

1.//Set the coordinates of the movie fragment x and Y;
2. Basex = random (450);
3. Basey = random (300);
4. for (var i = 0; i<6 i++) {
5.     num = i*17;
6.    //Set the number of split circumference;
7.     angle_num = Math. Pow (2, i+2);
8.    //Set the radius of the movie fragment's avatar;
9.     r = + i*15;
10.   //Set the level of the movie fragment at the same place;
11.    D0 = Math. Pow (2, I)-1;
12.    d = 4*d0;
13.    for (var j = 0 J < Angle_num; J + +) {
14.    if (i = = 0) {
15.&NBSP;&N bsp;       d = 0;
16.     }
  depth = d+j+1;

18.//Copy video clips
Duplicatemovieclip ("Itnstar", "Itnstar" Add I add j, depth);
20.//Set the angle of each film fragment
angle = J*math.pi/180*360/angle_num;
22.//Set the film fragment attributes;
SetProperty ("Itnstar" Add I add J, _x, Basex+math.cos (angle) *r);
SetProperty ("Itnstar" Add I add J, _y, Basey+math.sin (angle) *r);
SetProperty ("Itnstar" Add I add J, _alpha, 100-num);
SetProperty ("Itnstar" Add I add J, _xscale, 100-num);
SetProperty ("Itnstar" Add I add J, _yscale, 100-num);
28.}
29.}

Add the above code to frame 1th, then click Frame 2nd, and write the following line of code:

Stop ();

Program analysis: Know the reason why

The essence of the above code is by copying an instance into multiple, and displaying it according to a regular distribution, to achieve the effect of fireworks blooming. The line of code that starts with "//" is a program annotation, which is not optional, but is a simple description of the program code, which is automatically ignored by the runtime Flash. In the code above, the 2nd and 3 lines are the x, y base coordinates of the star movie fragment, the center point coordinate of the last animated animation, the random (value) function gets a random value between the 0~value-1. We know that in the three-dimensional, distant objects are darker than the objects near them, so the 5th line of NUM is the value of the transparency and scaling of the clips at the back of the movie to make the whole image look three-dimensional. The attribute values for the movie fragment are set at 25, 26, and 27 rows. The return value of the Math.pow (x, y) function in line 7th is the Y-second side of X.

The following is a description of the function duplicatemovieclip (target, newname,depth) in line 19th, which is used to copy a fragment of a movie, where: target: The clone of the source movie fragment that was used to copy ( In this case, an instance of the Mvcstar object Itnstar)

NewName: The name of the object (that is, the new movie fragment that is copied). In this case, because you want to copy multiple objects, in order not to duplicate the name of the object, this argument is expressed in the form "" Itnstar "Add I add J", and it means that after the character Itnstar plus the numeric variables I and J, the values of the variables I and J are automatically incremented by the For Loop, In this way, the object names that follow will automatically become Itnstar01, Itnstar02, Itnstar11, Itnstar12 ...

Depth: This is a stacking parameter. Specifies the display level of the newly completed object when it overlaps with other objects, and the larger the depth, the more on the displayed object. If there are two video clips with the same level of display, then the copied clips will be replaced by the later creation.

The point of view of the film fragment and the level of the value of a certain mathematical operation skills, the design idea is: With the variable i control video clips show a few laps, variable J to control the number of movie fragments per circle. In the first lap (i=0) There are four pieces of video clips, each divided into 360/4=90 degrees, the level of which is 1~4, the second circle (I=1) has eight film fragments, each part of the 360/8=45 degree, where the level is 5~12, and so on.

Just do it!

The fireworks in this example are circular, depending on the x and Y values determined by the mathematical formula Math.Cos (angle) *r and Math.sin (angle) *r. You can design other mathematical formulas to get different shapes of fireworks. In addition, in order to make the animation more lifelike effect, can also add fireworks when the sound effects of the launch.