::Preloaders ::

Take your completed Flash MX project. First test the movie to make sure a preloader is needed, after all no need in creating the preloader if the movie will only take a couple of seconds to load on a 56k modem. To test the streaming time of the movie first test movie [Ctrl+Enter] then test streaming [Ctrl+Enter again] Check the Debug tool on the menu bar to make sure the download speed is set correctly. :-)

So you have now realised that your movie is to big. How are you going to fix the problem? You can use a preloader. There are two types of preloader, Generic and Progress bar. A generic preloader is just an simple movie that repeats until your finish project has loaded, this is a very simple and easy preloader to create. However, although this may be useful if your movie loads in under a minuet movies that are bigger may require a progress bar. A progress bar allows the user to view how long the movie has left to load. This means that they will not think any errors have occurred if the movie takes a while to load.

Now I will explain how to create each type of preloader.

Generic Preloader

Open the scene window in flash [F11]. Add a new scene and call it "preloader".
Imortant: Make sure that this frame goes to the top of the list, with all other scenes below it. Name the last scene "Site"
In scene "preloader" create two layers. Name them "actions" and "preload".
In the "preload" layer, create a simple graphic or movie that you want the user to see to show the movie is loading. E.g. A flashing movie that says "Loading".
In the "actions" layer add a key frame [F6] in frame 2.
Open the Action Panel and use the drop down menu to change to the Expert mode. Highlight the key frame in frame 5 and add the frame label "LoadCheck". Highlight the key frame in frame 5 and add the following frame action
ifFrameLoaded ("Site", "complete") { gotoAndPlay("Site", 1); }
In the "actions" layer, add a blank key frame [F6] in frame 10. Highlight the key frame in frame 10 and add the following frame action
gotoAndPlay("LoadCheck");
Go to the last scene in your list. It might be "Site" it might be another scene (site needs to be the last scene). In the action layer, go to the last frame in the entire animation. Add a keyframe and add the frame label "complete".
Test your movie again and debug the streaming.

Progress bar preoader

Add a new scene [F11], name it "preloader". Put it at the top of the list of scenes. Make sure the scene you want to appear second is second on the list.
In the scene "preloader" create a new movie clip. Name it "Preloader".
In the new movie clip create three layers; "actions", "bar" and "text"
In the "bar" layer draw a rectangle [no stroke] and highlight it.
In the property inspector enter the following size and position settings :
- W: 1
- H: 10
- X: 0
- Y: 0
Select frame 100 on the time line and insert a key frame [F6]. Select the rectangle in frame 100, and change the size and position settings to:

W: 100
H: 10
X: 0
Y: 0

With the property inspector open, select frame 1 and select shape tween.
In the "text" layer select the text tool and click on the stage. In the property inspector, change the text type to Dynamic Text. Underneath Dynamic Text Box, in the box Name Instance, name the instance: "status" and change the position settings to:
- W: 150
- H: 16
- X: 0
- Y: 15
Font: _sans (or pick a standard font, don't pick a font that doesn't appear on both Mac and PC systems), Font Size: 10 Color: Match the Bar.
Extend the text layer to frame 100.
In layer "actions", add a stop action to frame 1.
Return to the scene "preloader" timeline.
Create two layers: "actions" and "preloader"
In scene "Preloader", layer "preloader", put an instance of the "Preloader" movie clip (the one you just made) on the stage.
In layer "actions", add a stop action in frame 1.
Highlight the preloader movie clip on the stage. Open the Action Panel and use the drop down menu to select the EXPERT mode. Type the following action script into the panel.
onClipEvent(enterFrame){ loaded = _root.getBytesLoaded(); total = _root.getBytesTotal(); framesLoaded = Math.ceil((loaded / total) * 100); goToAndStop(framesLoaded); status.text = framesLoaded + "% completed"; //Text that will appear in loading bar if(framesLoaded >= 95){ _root.gotoAndPlay(1, 1); } }
In the Action Panel drop down menu, pick Check Syntax. If there are errors, fix them.
Test your movie again and debug the streaming.

~Top~

<<Back