Using Flash to make a continuous rotating globe instance tutorial

Source: Internet
Author: User

When I was in school, I often saw the teacher holding a globe to give us lessons, when looking at the beautiful rotating globe really want to own one. Now this wish has finally come true! Hey, not to buy, but to use flash production! and also a transparent Earth with three-dimensional sense (Figure 1), it can be widely used in many flash animations, such as some of the website opening animation and Flash video.

Material preparation

1, start Flash, press "CTRL + N" To create a new animation, press "Ctrl+m" to open the movie Properties window, set the movie size is 80pxx80px, background color set to black.

2. Now we're going to make a global outlook. Press "Ctrl+f8" to insert a "Graphic (graphics)", named "Foreground", using a circle tool to draw a circle. Set the fill color of the circle, select "Windows→panels→fill and mixer" to open the fill and Color Control Panel, then select "Radial gradient (x ray)", click on the front block, and adjust the "Alpha" in the mixer panel to "0%". This will make the center of the Circle Transparent, click on the small block, the color set to dark blue. The silent fill effect is in the middle, and we can choose the Transform fill in the paint bucket option to move the center of the fill to the left, so that the earth will look a little stereoscopic.

3, press "Ctrl+f8" inserts a graph, the name is "The Circle", draws a circle, fills the color to be free. Then insert a graphic, named "Map", use the Pencil tool (Pencil) to sketch a flat map of the world in the workspace (you can also import a bitmap and then break the buckle) and then use the Paint bucket tool (Paint Bucket Tool) to fill it with green and remove the edges drawn with the pencil tool. Finally, copy the whole map again, and put the two maps side by side. The material we need here is ready.

Production process

1. Return to the scene, drag the foreground in the gallery to layer 1, then right-click at 50 frames and select Insert Frame.

2, create a new layer, named "Circle 1", the Gallery of "circle" dragged into the layer, adjust the position so that it and the "foreground" layer of the circle coincide, and at 50 frames inserted frame. Create a new layer named "foreground map", insert keyframes in the first frame, drag the gallery "map" just done, and adjust the location of the map so that Africa is just beyond the circle point; Insert keyframes in 25 frames, move the map to the left to North and South America, make North and South America at the center of the circle; at the end of the 50 frame, insert the keyframe, Continue to move the map, so that the second Africa just beyond the circle point, so the advantage of arranging map location is that the animation in the playback more fluent, not beatings phenomenon.   Then the 1th frame to 25 frames and 25 frames to 50 frames to "Motion (motion)", and finally on the "Round 1" layer on the right button, select "Mask (Mask)." Tip: When adjusting the map position, the map is blocked by the circle, not easy to watch, you can click on the "Graphics 1" layer "Show/hide all Layers (Show/Hide layers)" To hide the circle.

Here has been a general effect, the following we have to do is the back of the rotation of the earth, with this effect animation will be more perfect.

3, insert a layer, named "Circle 2", the Gallery of "circle" dragged into the layer, adjust the position and the "foreground", "Circle 1" layer of the circle overlap. The frame is then inserted at 50 frames.

4, then insert a layer, named "back of the Earth", in the first frame insert key frame, the map of the library to drag, select "Modify-transform--flip horizontal" for horizontal conversion. Right-click on the map in the workspace, select "Panels--effect", adjust the color of the map, change from green to black, adjust its position so that it matches the positive earth. Insert keyframes at frame 50th, move the map position to the right, and set "Motion" between 1 and 50 frames. Finally, on the "Circle 2" layer, right-click, select "Mask" (mask).

Here the entire animation is complete, figure 2 is the entire animation timeline, "Ctrl+enter" to see, how, the effect is not bad?


This animation mainly uses the Mask function of Flash, the clever use of mask can make a lot of use of common methods difficult to achieve the effect. It is important to note that the mask itself only determines a display range, while in flash the mask is a counter mask, that is, the contents of the mask layer will show the contents of its lower level, there is no mask will not display the underlying content, which is exactly the opposite of our reality.

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