Flash ActionScript Tutorial: Load External Image to Loader

The loading of external images into the MainTimeline with Flash ActionScript is almost the same as the loading of external swf files. This first tutorial shows how to create a new Loader, load the external image into the Loader. Then finally display the Loader on the MainTimeline.

Flash ActionScript tutorial example display here. Your flash player version is too old to see this Flash tutorial!

Flash Tutorial Content:

The loading of external images into the MainTimeline with ActionScript is almost the same as the loading of external swf files.

The complete Flash Movie is shown as above, you may try how it works before you start this tutorial. It simply loads the external image on the MainTimeline with a Loader. It also shows how to remove the Loader

Flash ActionScript Codes:

var imageLoaded:Boolean = false;

// URL of the external image content
var myRequest:URLRequest=new URLRequest("logo.png");

// Create a new Loader to load the image
var myLoader:Loader=new Loader();

// 1st level IO_ERROR input and output error checking
// Listen error events for the loading process
myLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, ioError);

function ioError(event:ErrorEvent):void {

// Display error message to user in case of loading error.
output_txt.text = "Sorry that there is an IO error during the loading of an external image. The error is:" + "\n" + event;

}

function checkComplete(evt:MouseEvent) {

// 2nd level SecurityError error checking
// Use the try-catch block
try { // Load the external image into the Loader
myLoader.load(myRequest);} catch (error:SecurityError) {// catch the error here if any
// Display error message to user in case of loading error.
output_txt.text = "Sorry that there is a Security error during the loading of an external image. The error is:" + "\n" + error;}

}

image1_btn.addEventListener(MouseEvent.CLICK, checkComplete);

// Listen when the loading of image is completed
myLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadImage1);

function loadImage1(myEvent:Event):void {

// Display the Loader on the MainTimeline when the loading is completed
addChild(myLoader);
// Set display location of the Loader
myLoader.x = 160;
myLoader.y = 50;
// Set imageLoaded to true so that the Image can be unloaded
imageLoaded = true;

}

// Function to remove the Loader
function removeImage(evt:MouseEvent):void {

if (imageLoaded == true) {myLoader.unload();
removeChild(myLoader);
// Set imageLoaded to false to prevent error when no Image loaded
imageLoaded = false;}

}

remove_btn.addEventListener(MouseEvent.CLICK, removeImage);

Download Flash Source File:

load-image-1.fla

Remarks:

Actually you can also create a new Sprite and create a new Loader. Then load the external image into the Loader, add the Loader into the Sprite. And finally display the Sprite on the MainTimeline. The next Flash ActionScript tutorial will show how to do that.