1. create a new FLA
2. Create 3 layers, called, from top to bottom, actionscript, preloader and assets (fig1)
fig1 3. We are now going to create the preloader itself. select the first frame of the preloader layer and on the stage draw a 350x15 rectangle with a fill color value of #CCCCCC and a stroke color with a value of #666666 (colors are obviously a matter of taste, you don't need to stick to it).
select your rectangle (fill and stroke) and press F8 convert it as a Movie clip and name it preloaderMC. (fig2)
fig2Double click on your movie clip (or right click on it and from the context menu choose Edit in Place.
We are now going to create a mask that will move over the loading, as the data is loaded, and show the progress to the user.
In our preloaderMC Movie clip create, from top to bottom, a layer called stroke, then mask and call the final bottom layer where the rectangle sits graphic (fig3).
fig3 We are now going to cut the stroke from the rectangle and paste it on the top layer called stroke. Double click on the stroke to select it, then from the right context menu (or from the main menu) select Cut. select the first frame of the top layer called stroke, right click on it and from the context menu select Paste in Place.
Select the fill color of the rectangle, then from the right context menu (or from the main menu) select Copy (not Cut this time). Select the first frame of the layer called mask, right click on it and from the context menu select Paste in Place. You can now lock the layer stroke and graphic. (fig4)
fig4 Select the rectangle we just copied and pasted on the mask layer and change its color to a blue of value #0000FF (we just change the color to differentiate the mask from the graphic of the preloader that sits on the graphic layer). Press F8 and convert this new rectangle to a movie clip and call it maskMC (fig5). Select the Instance of maskMC on the stage and in the property panel give it the Instance name mask (fig6).
fig5
fig6 Continue to next page...