Ranked as a 2, reviewed as a 4.
I voted relatively low on this tutorial even I generally value tutorials high. I believe in sharing information.
However, the presentation of this piece was slow, and distracting. I found it extremely difficult to read the crowded text in that wonky font, and I really disliked having to wait for the entire opening animation to play again before I could move to the next item in the tutorial.
I also believe that in any tutorial, the user should be able to print out what they learn.
By the way, while a tween will work for a preloader, this can cause problems if the data loads very quickly, and you end up with a much larger object than you need. Here's a simpler approach:
1) create a filled rectangle to be your preload movie. Select it and press F8 and convert it to a movie clip. Call it "preloader".
2) Double-click to edit the preloader clip. Select the fill inside the rectangle. Press F8 and convert it to a movie clip. call it "indicator". Open the property inspector for that instance of the clip, and type in the name "indicator" for that clip, so you can acces it with ActionScript later.
3) Double-click to edit the indicator clip, then select the fill, and using the property inspector, type in 0,0 for the vertical and horizontal position of the fill. We want this to have its origin at 0, so when we later change the size of the clip, it will appear to grow from left to right instead of spreading out from the middle.
4) Double click outside the indicator clip to change your focus back to the preloader clip. The fill will no longer be lined up with the outline, so reposition the indicator clip inside the outline.
5) select the indicator clip and open the ActionScript editor. Attach the following code to the clip:
onClipEvent (load) {
this._xscale = 0;
}
6) Double click outside the preloader clip to change your focus back to the root movie. Position the preloader on the stage wherever you think it looks most appealing. Open your ActionScript editor, select the preloader clip, and attach the following code:
onClipEvent (enterFrame) {
percentage = Math.floor(_root.getBytesLoaded()/_root.getBytesTotal()*100
);
this.indicator._xscale = (percentage);
if (percentage == 100) {
_root.gotoAndPlay("startAnimation");
}
}
That's all there is to it. Simply create a frame label called "startAnimation", or replace that label with a name you think prettier.
You should place a "stop();" action on the frame where the preloader lives. The keyframe where you want the movie to start playing when the movie has loaded (I called mine "startAnimation"), should have a "play();" action attached to it.
Hope this is helpful to you.