Parallel image loading in a single class instance with AS3

My problem occurs when I try to load multiple images in one class in AS3.

My code looks something like this:

// Load image 1
var ldr1:Loader = new Loader();
ldr1.contentLoaderInfo.addEventListener(Event.COMPLETE, complete1);
ldr1.load(new URLRequest("img1.jpg"));

// Load image 2
var ldr2:Loader = new Loader();
ldr2.contentLoaderInfo.addEventListener(Event.COMPLETE, complete2);
ldr2.load(new URLRequest("img2.jpg"));

// Load image 3
var ldr3:Loader = new Loader();
ldr3.contentLoaderInfo.addEventListener(Event.COMPLETE, complete3);
ldr3.load(new URLRequest("img3.jpg"))

My problem with this is, that every complete-method receives the same image. Sometimes they all get img1.jpg, sometimes they all get img3.jpg….

I don't have any clue why this is happening.

I'm thankful for any help you can give me.

This is the exact code that I used:

Class CuboidBookView

public function addBackMaterial(url:String):void {
    var loader:Loader = new Loader();
    loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onBMComplete);
    loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, function (e:IOErrorEvent):void {});

    loader.load(new URLRequest(url));
}
private function onBMComplete(e:Event):void {
    var bmp:Bitmap = Bitmap(LoaderInfo(e.target).content);
    backMaterial = new BitmapMaterial(bmp.bitmapData);
    hidden = false;
}

public function addFrontCoverMaterial(url:String):void {
    var loader:Loader = new Loader();
    loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onFCMComplete);
    loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, function (e:IOErrorEvent):void {});

    loader.load(new URLRequest(url));
}
private function onFCMComplete(e:Event):void {
    var bmp:Bitmap = Bitmap(LoaderInfo(e.target).content);
    frontCoverMaterial = new开发者_如何学JAVA BitmapMaterial(bmp.bitmapData);
}

public function addRearCoverMaterial(url:String):void {
    var loader:Loader = new Loader();
    loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onRCMComplete);
    loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, function (e:IOErrorEvent):void {});

    loader.load(new URLRequest(url));
}
private function onRCMComplete(e:Event):void {
    var bmp:Bitmap = Bitmap(LoaderInfo(e.target).content);
    rearCoverMaterial = new BitmapMaterial(bmp.bitmapData);
}

These methods are called in another class:

CuboidBookView(book.view).addBackMaterial("../res/books/" + b.file + "_back.jpg");
CuboidBookView(book.view).addFrontCoverMaterial("../res/books/" + b.file + "_front.jpg");
CuboidBookView(book.view).addRearCoverMaterial("../res/books/" + b.file + "_rear.jpg");

Edit: I thought, this would help, but it had the same result:

public function addMaterials(name:String):void {
    // Load background image
    var ldr1:Loader = new Loader();
    ldr1.contentLoaderInfo.addEventListener(Event.COMPLETE, function (e:Event):void {               
        var bm:Bitmap = e.currentTarget.content as Bitmap;
        backMaterial = new BitmapMaterial(bm.bitmapData);
        hidden = false;
    });
    ldr1.load(new URLRequest("../res/books/" + name + "_back.jpg"));

    // Load front cover
    var ldr2:Loader = new Loader();
    ldr2.contentLoaderInfo.addEventListener(Event.COMPLETE, function (e:Event):void {
        var fcm:Bitmap = e.currentTarget.content as Bitmap;
        frontCoverMaterial = new BitmapMaterial(fcm.bitmapData);
    });
    ldr2.load(new URLRequest("../res/books/" + name + "_front.jpg"));

    // Load rear cover
    var ldr3:Loader = new Loader();
    ldr3.contentLoaderInfo.addEventListener(Event.COMPLETE, function (e:Event):void {
        var rcm:Bitmap = e.currentTarget.content as Bitmap;
        rearCoverMaterial = new BitmapMaterial(rcm.bitmapData);
    });
    ldr3.load(new URLRequest("../res/books/" + name + "_rear.jpg"))
}

Now the different Bitmaps and Loaders have distinct names and are called within the same method call. The event handlers now are inline.

I cannot figure out where the mistake is.

What do your complete1(), complete2() and complete3() methods look like?

What I'd do is save the bitmap from the loader in the following way.

private function complete1(e:Event):void
{
    var image:Bitmap = e.currentTarget.content as Bitmap;
}

Then use this bitmap to render your image.

Obviously using a different variable for each bitmap. I normally have a Dictionary of BitmapData that I save to once loaded.

If the code you posted is exactly what you have in your program then this should work fine.

There really was a problem with the implementation of the Cube in Away3d. Some callbacks were not save.

I found a solution in reimplementing the whole class.