Flash ActionScript Tutorial: Load External Image to Empty MovieClip with Text Preloader
This is always good to let users know how long have to wait for the external image to load up in the Flash Movie. A preloader is the best solution. We will use text Pre-loader in this Flash ActionScript tutorial. A text pre-loader is very easy to install and use.
Flash Tutorial Content:
When the file size of the external images are large. This may take some time to load the external image to the Flash Movie. Under this situation, you may consider to add a preloader that shows the progress or status of the loading otherwise the visitors do not know what happens. This Flash ActionScript tutorial shows how to make a very simple text preloader. If you do not like gimmick preloader, this text preloader should be the first choice of your Flash Movie.
The complete Flash Movie is shown as above, you may try how it works before you start this ActionScript tutorial.
Flash ActionScript Codes:
//URL of the external image content
var myRequest:URLRequest=new URLRequest("island.png");
//Create a new Loader to load the image
var loader:Loader = new Loader();
//Load the external image into the Loader
loader.load(myRequest);
//Declare the loading percentage
var percent:Number;
//Listen to the progress of the loading
loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, loadingProgress);
function loadingProgress(evt:ProgressEvent) {
percent = Math.round((evt.bytesLoaded/evt.bytesTotal) * 100);
//Display the loading percentage to visitors
//Actually you can use AS to add the TextField dynamically
percentLoaded_txt.text = "Loading picture.... " + String(percent) + "% loaded";
}
// Listen when the loading of image is completed
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadingComplete);
function loadingComplete(evt:Event) {
//The holder_mc (new symbol) was created before by:
/*
Insert -> New Symbol -> Select MovieClip
Give this new symbol any name you like (e.g. MyImage)
Return to the scene.
Drag the MovieClip (e.g. MyImage) into your scene from the Library window
Give the instance name of this MovieClip "holder_mc"
*/
holder_mc.addChild(loader);
//Hide the loading progress text that no longer in use
percentLoaded_txt.visible = false;
}
Download Flash Source File:
Remarks:
Some Flash Designerwould like more fancy or interesting preloader. The next Flash ActionScript tutorial will show how to add a more interesting preloader, a ProgressBar preloader to Flash Movies.