LoaderMax load his own instance

[dingoman]

Hi,

I am trying to load some images from xml with LoaderMax.

When the LoaderMax finish his images loading he try to load himself,

 

In the childComplete function I use the rawContent, but when the LoaderMax try to load his own instance I get an error says that loaderMax don't have rawContent.

 

To bypass it I use this if statement

 

if (event.target !="LoaderMax 'loaderMaxName'") 

 

I am sure there is better way to bypass it,

What can I do?

 

Thanks,

DingoMan

[Carl]

HI,

 

A LoaderMax doesn't have rawContent. It has .content which is an array containing the content of each loader inside the LoaderMax.

 

I don't know what you mean by

 

When the LoaderMax finish his images loading he try to load himself

 

Can you please explain more clearly. I imagine there may be a language barrier, but I don't understand the question of how a Loadermax can load itself. Are you referring to <LoaderMax> nodes in the xml?

[dingoman]

Sorry on the lack of information, I will try to explain myself again.

 

xml code :

 

 <?xml version="1.0" encoding="iso-8859-1"?>
<data>

 <LoaderMax name="dynamicLoaderMax" load="true" prependURLs="http:///product_images/pTRU1-">
 <ImageLoader name="body" url="1_dt.png" />
 <ImageLoader name="body" url="1_dt.png" />
 <ImageLoader name="body" url="1_dt.png" />
 <ImageLoader name="eye" url="1_dt.png" />
 <ImageLoader name="eye" url="1_dt.png" />
 <ImageLoader name="eye" url="1_dt.png" />
 </LoaderMax>

</data> 

 

LoaderMax code:

 

LoaderMax.activate([imageLoader]);
var queue:XMLLoader= new XMLLoader("xml/looseImageLoaders.xml",{name:"xmlDoc",
maxConnections:1,
estimatedBytes:5000,
onComplete:queueCompleteHandler,
onProgress:queueProgressHandler,
onChildProgress:imageProgressHandler,
onChildComplete:imageCompleteHandler });

queue.load();

 

childComplete code:

 

private function imageCompleteHandler(event:LoaderEvent):void {
 trace("Child load is Complete");
 if (event.target !="LoaderMax 'dynamicLoaderMax'")
  { trace(event.target.content);
 var loadedImage:Bitmap = event.target.rawContent as Bitmap;
 var image:Image = new Image(Texture.fromBitmap(loadedImage , false));
addChild(image);
var spr : Sprite = new Sprite();
spr.addChild(image)
  addChild(spr);
 }
}

 

 

 

as you said the loaderMax is an array of all the childs and not a raw content.

But why it's try to load my loaderMax instance?

Is there any way to avoid it and get more generic way then this if statment:

 

if (event.target !="LoaderMax 'dynamicLoaderMax'")

 

 

Thanks, and sorry again on the lack of info from the first post.

Dingo

[Carl]

Hi, thanks for the much clearer explanation.

The reason why you had to put that conditional statement in there is because the LoaderMax in your xml is actually a child of the XMLLoader because the LoaderMax node had

 

load = "true"

 

Your XMLLoader had multiple types of children so the onChildComplete callback had to be modified with your conditional to see if the child that just loaded was a LoaderMax or not.

 

Another way to write that conditional would be

 

 

 

if(event.target is ImageLoader)
  { trace(event.target.content);
 var loadedImage:Bitmap = event.target.rawContent as Bitmap;
 var image:Image = new Image(Texture.fromBitmap(loadedImage , false));
addChild(image);
var spr : Sprite = new Sprite();
spr.addChild(image)
  addChild(spr);
 }

 

There are a few ways of getting around the conditional.

 

Set load=true on each ImageLoader node in the xml but NOT on the LoaderMax

 

 

<LoaderMax name="dynamicLoaderMax" prependURLs="http:///product_images/pTRU1-">
	 <ImageLoader name="body" url="1_dt.png" load="true" />
	 <ImageLoader name="body" url="1_dt.png" load="true"/>
	 <ImageLoader name="body" url="1_dt.png" load="true"/>
	 <ImageLoader name="eye" url="1_dt.png" load="true"/>
	 <ImageLoader name="eye" url="1_dt.png" load="true"/>
	 <ImageLoader name="eye" url="1_dt.png" load="true"/>
 </LoaderMax>

 

The method above will prevent the LoaderMax from being a child of the XMLLoader, but the ImageLoaders will still load and the onChildComplete callback won't need a condtional to see if the child that just loaded is not an XMLLoader.

 

----

 

I could stop there, but there is another way.

 

Do not set load = true on the LoaderMax OR the ImageLoaders.

This will make is so the XMLLoader simply loads the xml file, builds the LoaderMax and ImageLoaders but does not load any external assets.

 

When the xml is done loading, you then find the LoaderMax that was created, assign it various eventListeners CHILD_PROGRESS, PROGRESS, CHILD_COMPLETE and then tell the LoaderMax to load.

 

here is the xml:

<data>
<LoaderMax name="gallery">
<ImageLoader name="whale" url="images/whale.png" estimatedBytes="60000"   x="0" y="0" /><ImageLoader name="crab" url="images/crab.png" estimatedBytes="94000"  x="320" y="0"/>

<ImageLoader name="lobster" url="images/lobster.png" estimatedBytes="94000"   x="0" y="200"/>
<ImageLoader name="bird" url="images/bird.png" estimatedBytes="60000"	x="320" y="200" />
</LoaderMax>
</data>

 

*note load is not set to true anywhere.

 

here is the actionscript:

 

//LoaderMax that will be based upon loaders in the xml
var galleryLoader:LoaderMax;

var queue:XMLLoader = new XMLLoader("xml/nestedLoaderMax.xml",{name:"xmlDoc",
maxConnections:1,
estimatedBytes:5000,
onComplete:xmlCompleteHandler
});
queue.load();

function xmlCompleteHandler(event:LoaderEvent):void {
trace("xml loaded");
buildLoaderMax();
}

function buildLoaderMax() {
galleryLoader = LoaderMax.getLoader("gallery");
trace(galleryLoader);
galleryLoader.maxConnections = 1;
galleryLoader.addEventListener(LoaderEvent.PROGRESS, totalProgressHandler);
galleryLoader.addEventListener(LoaderEvent.CHILD_PROGRESS, imageProgressHandler);
galleryLoader.addEventListener(LoaderEvent.CHILD_COMPLETE, imageCompleteHandler);
galleryLoader.load();
}


function imageProgressHandler(event:LoaderEvent):void {
 progressBar_mc.bar_mc.scaleX = event.target.progress;
}



function imageCompleteHandler(event:LoaderEvent):void {

var loadedImage:ContentDisplay = event.target.content as ContentDisplay;
loadedImage.scaleX = loadedImage.scaleY = .5;
loadedImage.alpha = 0;

addChild(loadedImage);

TweenLite.to(loadedImage, .5, {alpha:1});
}

function totalProgressHandler(event:LoaderEvent):void {
totalProgressBar_mc.bar_mc.scaleX = event.target.progress;
}

 

The advantage of this approach is that you don't have to have the callback functions defined in your XMLLoader (onChildProgress, onChildComplete) configured to handle multiple media types. You can apply custom eventListeners for each LoaderMax like so:

 

 

galleryLoader.addEventListener(LoaderEvent.PROGRESS, totalProgressHandler);
galleryLoader.addEventListener(LoaderEvent.CHILD_PROGRESS, imageProgressHandler);
galleryLoader.addEventListener(LoaderEvent.CHILD_COMPLETE, imageCompleteHandler);

 

this would be helpful if your XML contained multiple LoaderMaxes that needed to serve completely different purposes and perhaps they needed to be loaded at different times and you wanted to handle their load progress in different ways.

 

 

I have attached a cs4 zip including all the files to run this approach of configuring an externally defined LoaderMax after the XMLLoader has loaded the xml.

XMLLoader_advanced.zip

[dingoman]

WOW!!

Thank you very much for your high detail explanation!!

it's sure help me alot

​

Thanks

[Carl]

You're welcome. I always imagined something like this would be the missing "part 3" to my LoaderMax tutorials. XMLLoader and LoaderMax have a ton of features and possible configurations. It can take some time to wrap you head around it all.