Flash visual Effects: The light of science and technology

Source: Internet
Author: User
Tags cos insert sin
Effects Behavioral features Overview

I believe that we have seen the effect of the picture will be interested in this effect. The effect of this example is to imitate the design of science books in childhood, visual effect is very strong.

In the production of the instance, only simple copy statements and movie clips ' _x (coordinates), _rotation (angle) and other properties are used.

Examples are not complicated, but often a simple and graceful graphic with a piece of intelligent code can achieve a cool effect. I don't believe we'll see.

Effect chart

Before you start making, please set the scene size to 300pxx300px, the background is black, frame frequency is 30fps.

  First, design components.

1. Press the shortcut key Ctrl+f8 to create a new movie clip symbol named "element."

2. The line tool in the click of the toolbar draws a green vertical bar (solid line, line width 0.5) that is 5px high in the editing scene of the element component. Then click the Ellipse tool and pull a yellow circle from the bottom left of the line (press SHIFT and 2px in diameter). As shown in Figure 1.



Figure 1

3. Creates a new movie clip symbol called element motion. Press the shortcut key ctrl+l to open the library, drag the "element" component in the library to the edit scene of the element movement component. Note that the coordinates of the "element" component in the scene are (0px,-50px). Click the 45th frame, press F6 to insert the keyframe, right-click Frame 1th of Layer 1, select Create motion Tween from the pop-up menu, and then click the 10th, 25 frames, and press F6 to insert the keyframe. As shown in Figure 2.



Figure 2

4. Click the element symbol in frame 10th, and then select the Advanced Options option in the Color Drop-down menu of the Properties panel, and the Settings button, as shown in Figure 3, in the Open Advanced Effects panel.



Figure 3

5. Click the element component in frame 25th, press the arrow keys to move it left and down by 1 pixels, and then set its transparency to 30% in the Properties panel.

6. The "element" component in frame 1th and 45 is not set.

The two components used in the effect are here to be made, so let's design the main scene.

  Second, the design of the main scene.

1. As shown in Figure 4, create "script", "component" two layers, each 2 frames. Drag the movie clip element movement clip symbol from the library to the corresponding components layer. Click it again and give it an instance name "element" in the properties panel. As shown in Figure 5.



Figure 4



Figure 5

2. Select Frame 2nd in the script layer and press F7 to insert a blank keyframe. Then select two frames and press F9 to open the Actions panel, select Expert mode, and type the following code, respectively.

The code in frame 1th is as follows:

The Math.sin () method evaluates and returns the sine of the angle specified in radians
The Math.Cos () method evaluates and returns the cosine of the angle specified in radians
element. _x = Math.sin (n) *60 + 150;
element. _y = Math.Cos (n) *60 + 150;
_rotation property can change the angle of an instance
element. _rotation = i;
To copy an "element" instance
Duplicatemovieclip ("element", "element", I);
i + 3;
n + 0.07;
Stop playing a movie when the variable i is greater than 1080
if (i>1080) {
Stop ();
}

3. The code in frame 2nd is as follows:
gotoAndPlay (1);

Well, do this here the effect is complete, finally you can download the source file learning.

  . fla Source file download



Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.