How to use the AssetLoader component

The AssetLoader class loads and displays visual assets, such as images or SWF library symbols.

The Basics

Create an AssetLoader control and add it to the display list.

var loader = new AssetLoader();
addChild(loader);

Two different types of assets may be loaded.

• Assets defined in the OpenFL project.xml file of type IMAGE or MOVIE_CLIP.
• A URL loaded from the web in any format supported by openfl.display.Loader.

To load an asset defined in project.xml, set the source property to the name of the asset.

loader.source = "my-asset-id";

Alternatively, to load an asset from the web, set the source property to the asset's URL.

loader.source = "https://example.com/img/asset.png";

Events

Add an event listener for Event.COMPLETE to perform an action when the image finishes loading.

loader.addEventListener(Event.COMPLETE, loader_completeHandler);

Listeners for Event.COMPLETE have the following function signature.

function loader_completeHandler(event:Event):Void {
    var loader = cast(event.currentTarget, AssetLoader);
    trace("asset loaded: " + loader.source);
}

Add an event listener for IOErrorEvent.IO_ERROR and SecurityErrorEvent.SECURITY_ERROR to perform an action if the asset fails to load.

loader.addEventListener(IOErrorEvent.IO_ERROR, loader_ioErrorHandler);
loader.addEventListener(SecurityErrorEvent.SECURITY_ERROR, loader_securityErrorHandler);

These listeners should have the following function signatures.

function loader_ioErrorHandler(event:IOErrorEvent):Void {
    var loader = cast(event.currentTarget, AssetLoader);
    trace("asset i/o error: " + loader.source + " => " + event.text);
}

function loader_securityErrorHandler(event:SecurityErrorEvent):Void {
    var loader = cast(event.currentTarget, AssetLoader);
    trace("asset security error: " + loader.source + " => " + event.text);
}

Related Links

• feathers.controls.AssetLoader API Documentation