From AS2 to AS3 loading external images

Question

I'm converting some Actionscript code from AS2 tp AS3, and I've eventually managed to get most of it to work again (it's allmost a totally different language, sharing just a little syntax similarity). One of the last things that still doesn't work, is the code for loading an external image.

Perhaps this has changed in AS3 but I really thought it was strange that to load an image you use loadVideo, why not loadImage? (on the other hand a flash application is constantly called a flash video even when it's not used for animation at all). This doesn't work anymore, and what I've found is a pretty complex code that is said to replace this oneliner imageholder.loadVideo(url); is this:

var urlreq:URLRequest = new URLRequest(url);
var theloader:Loader = new URLLoader();
theloader.load(urlreq);
theloader.addEventListener(Event.COMPLETE, function(event:Event):void {
        imageholder.addChild(theloader);
    }
);

But this doesn't work.. What I am doing wrong, and is there a more suited function to load images in AS3?

Answer 1

I discovered a soulution, myself.

Initializing or unloading a list of images (actually instances of MovieClip):

for (i = 0; i<imgHolders.length; i++) {
    var loader:Loader = imgHolders[i].getChildByName("imgloader"+i);
    if (loader) {
        loader.unload();
    } else {
        loader = new Loader();
        loader.name = "imgloader" + i;
        // Does't seem to work, commented out.
        //loader.addEventListener(Event.COMPLETE, centerimage);
        imgHolders[i].addChild(loader);
    }
}

when I need to change the image:

var loader:Loader = imgHolders[index].getChildByName("imgloader"+index);
loader.load(new URLRequest(newurl);

I tried to add a listner too to center the image, but it doesn't seem to get called? The first thing the centerimage function does is trace("centerImage"); wich doesn't appear at all...

Answer 2

I think you're making things a little too complicated - here's what you need to load a single image:

import flash.display.Loader;
import flash.event.Event;
import flash.net.URLRequest;

var imageLoader:Loader = new Loader();
imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, function(e:Event){
 // e.target.content is the newly-loaded image, feel free to addChild it where ever it needs to go...
});
imageLoader.load(new URLRequest('yourImage.jpg'));

... can you extrapolate from there to loading a list of images? Run that code in for-loop, each time assign a different variable (place in an array, perhaps, or property of an object) to your newly loaded e.target.content so you can access it outside of that 'onComplete'-type function.

Answer 3

One of most common problems people have with loaders is what they listen to for events. You need to make sure you're listening to the loader.contentLoaderInfo for most events, not the loader itself. That was the main problem in the example you provided.

//this is WRONG
loader.addEventListener(Event.COMPLETE, onLoad);

//this is RIGHT
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoad);