The preloader gives you an indication about starting an application, event or action. With FlashMX 2004 you could create a simple preloader using timeline. This tutorial will help you to create a simple flash preloader animation in timeline using FlashMX 2004.Th user must have some basic understanding of working with FlashMX 2004 or else visit our FlashMX 2004 tutorials and tips>We also provides you with cool tips and tricks regarding Dreamweaver, Fireworks and Photoshop
For viewing the animations in this site you need to install Flash Player 7.0 or higher and for downloading the .fla files from this site FlashMX 2004 must be installed in your system.
Steps for creating a simple timeline preloader
-
You need to create a graphics symbol. Type LOADING on the stage and convert it into a graphics symbol by selecting the word and pressing F8 (Choose symbol behavior as graphic) and press OK.
-
Create a ‘loading’ movie clip by pressing Ctrl+F8 and name it ‘loading_mc’ and set the behavior to Movie Clip and press OK.
-
Insert the loading graphics symbol in frame 1.Inser key frames in frame 5 and 10 by pressing F6.
-
Change the alpha value of the graphic symbol in the frame 1 to 0 in the color pop up menu of the property panel.
-
create motion tween in between the frames 1 and 15, frame 5 and10.You have successfully created The loading movie clip .Now go to scene 1.
-
The next step is to create the bar preloader by inserting 5 layers as shown below and name each layer as action, border, mask, bar and loading.
-
Drag and align loading_mc to the center of the stage in the frame 1 of the loading layer. On the 40th frame of the loading layer Press F5.
-
Select the first frame of the mask layer and draw a rectangle e as shown below.
-
Selecting the Frame 40 press F5 and double clip on the rectangle and copy it. Then go to the bar layer and paste it exactly in the same position of the initial. After that copy the border of the rectangle and paste it in the frame 1 of the border layer.
-
Select the 40th frame of the border layer and push the rectangle in the bar layer to the left as shown in the figure. Then return to frame 40 and pull the rectangle to the other side as shown below And Add shape tween effect between the frames 1 and 40.
-
Make the mask layer mask able by right clicking on that layer and selecting mask.
-
The final procedure is to insert script into the action script panel. In the action layer insert key frames in positions 1,2,,5,6,10,11,15,16,20,21,25,26,30,31,35,36 and the 40 the frame. Copy and paste the following script into the action panel to frames as mentioned below.
|
ifFrameLoaded ("s1") {
x = 1;
play ();
} |
Frame1 |
ifFrameLoaded ("s2") {
x = 2;
play ();
} |
Frame 5 |
ifFrameLoaded ("s3") {
x = 3;
play ();
} |
Frame 10 |
ifFrameLoaded ("s4") {
x = 4;
play ();
} |
Frame 15 |
ifFrameLoaded ("s5") {
x = 5;
play ();
} |
Frame 20 |
ifFrameLoaded ("s6") {
x = 6;
play ();
} |
Frame 25 |
ifFrameLoaded ("s7") {
x = 7;
play ();
} |
Frame 30 |
ifFrameLoaded ("s8") {
x = 8;
play ();
} |
Frame 35 |
gotoAndPlay ("start"); |
Frame 40 |
if (x != 1) {
gotoAndPlay(1);
} |
Frame 2 |
if (x != 2) {
gotoAndPlay(5);
} |
Frame 6 |
if (x != 3) {
gotoAndPlay(10);
} |
Frame 11 |
if (x != 4) {
gotoAndPlay(15);
} |
Frame 16 |
if (x != 5) {
gotoAndPlay(20);
} |
Frame 21 |
if (x != 6) {
gotoAndPlay(25);
} |
Frame 26 |
if (x != 7) {
gotoAndPlay(30);
} |
Frame 31 |
if (x != 8) {
gotoAndPlay(35);
} |
Frame 36 |
You simple timeline preloader is ready now. Build your main movie from the 41st frame and name it as “start”. After finishing the movie divide the total frame sin the movie by 8 and name it as s1, s2, s3 and so on. |
