as3 - Preloading XML Image Gallery

Question

I have an image gallery class that loads thumbnails and full images one-by-one in a loop. Then I push then into an array and create one movie clip with each bitmap. It's working good.

In witch part of this process I can preload all images, before display the entire gallery?

Thanx!

Answer 1

Personally I'm a huge fan of the awesome BulkLoader library:

• It's incredibly flexible
• It provides useful helpers to access loaded assets (e.g. getBitmap("asset_id") returns a typed object)
• It gives meaningful feedback on progress (values can optionally be returned to reflect progress by overall "weight" as opposed to the raw value from individual files that may vary significantly in size)
• It handles concurrent loading (which is obviously faster than loading in sequence).

Alternatively, if you want to roll your own solution, as you loop through, add an event listener to the

Event.COMPLETE

notification. In the handler for this event increment a counter; once this counter equals the number of elements you've loaded all your assets.

Pseudo-code:

var loadCounter:int = 0;

var img_arr:Array = [
    "img1_thumb.jpg", "img1.jpg", 
    "img2_thumb.jpg", "img2.jpg", 
    ... 
];
var image_num:int = img_arr.length;

var ldr:Loader;
var req:URLRequest;
var path:String;
var i:int   = 0;
for(; i < image_num; i++) 
{
     path = "http://myserver.com/images/" + img_arr[i];
     req  = new URLRequest(path);
     ldr  = new Loader();
     ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, _onLoadComplete);
     ldr.load(req);
}

private function _onLoadComplete(event:Event):void
{
    if(++loadCounter == image_num)
    {
        // do whatever you need to your loaded assets
    }
}