Link to home
Start Free TrialLog in
Avatar of cubical38
cubical38

asked on

AS3 XML add images in loader array next to each other?

Need:  On loading of each loader with image inside, place them one next to the other.  ie:  

loader[1].x=0;
next loader in array and loop:
loader[2].x=previous Loader.x + Loader.width;
next loader in array and loop:
loader[3].x=previous Loader.x + Loader.width;
ect...

Ideas?

my code for loading xml images:
var xmlData:XML = new XML();
var xmlList:XMLList = new XMLList();
var currentPic:int=0;
var xmlLoader:URLLoader = new URLLoader();

xmlLoader.addEventListener(Event.COMPLETE, onComplete);
xmlLoader.load(new URLRequest("xml/portfolio.xml"));

function onComplete(e:Event):void {
	trace("complete");
	xmlData=new XML(e.target.data);
	xmlData=new XML(xmlLoader.data);
	xmlList=xmlData.portfolio;
	loadImages();
}
var Length=xmlList.length();
function loadImages():void {
	trace("loadImages");
	var loaders = new Array();
	for (var i = 0; i < xmlList.length(); i++) {
		trace("i = " + i);
		loaders[i] = new Loader();
		loaders[i].load(new URLRequest(xmlList.pic[i]));
		trace("xmlList.pic[i] = " + xmlList.pic[i]);
		view.addChild(loaders[i]);
		trace("loaders.x = " + loaders.x);
		updatePic(currentPic);
	}

}
function updatePic(index:int):void {
	trace("updatePic");
}

Open in new window


my traces tell me that my images are being loaded.  I just need them to load next to instead of on top of each other...
Thanks for any and all help!

Avatar of blue-genie
blue-genie
Flag of South Africa image

ok so have you tried that code you specified ... and what was the result?

you wouldn't use Loader.width though, i think you need to check loader.loadercontent - also you might need to put a listener in to check that the image is loaded before you try to find out how wide it is.

then in your for loop you just need to set the x at the previous item (i.e i-1) x position + width.
Avatar of cubical38
cubical38

ASKER

Thanks,

As far as I can tell, images are loaded (at least in the trace it traces correctly) and witch ever image is the last in the xmlList appears (all stacking on the same x.y, hopefully).

So something like:
loaders[i].loadercontent.x = loaders[-i].loadercontent.x + 400;

?
As far as I can tell, images are loaded - no when you're actually doing it on a live server, you'll have a delay, so if you try to get the width of the image before its loaded you're going to get errors.

all stacking on the same x.y, hopefully) - huh ? i'm confused, i thought you didnt' want that?



So something like:
loaders[i].loadercontent.x = loaders[-i].loadercontent.x + 400;

something like but not quite

loaders[i-1] and you probably need to check if i != 0 otherwise i will be -1 and throw an error.

Hopefully - as in then they would all be loaded and it would just be moving the x

I'll set up a listener for event.COMPLETE and an if statement for the i !=0

Thanks again.  I wont be able to implement this until tonight, but the logic makes sense...
cool, that's the most important thing, finding the logic that works, googling the syntax is the easy part.
try and implement it and let's see how it works out.
Okay It may just be late in the day but I am getting stuck.  When I test this code I get the following trace:
complete
loadImages
i = 0
xmlList.pic[i] = images/AKLservices.jpg
i = 1
xmlList.pic[i] = images/Flare.jpg
i = 2
xmlList.pic[i] = images/AKLservices.jpg
i = 3
xmlList.pic[i] = images/Flare.jpg
bytesLoaded=0 bytesTotal=60445
bytesLoaded=0 bytesTotal=110141
bytesLoaded=0 bytesTotal=170586
bytesLoaded=0 bytesTotal=220282
bytesLoaded=60445 bytesTotal=220282
bytesLoaded=110141 bytesTotal=220282
bytesLoaded=170586 bytesTotal=220282
bytesLoaded=220282 bytesTotal=220282
updatePic
updatePic
updatePic
updatePic

Which tells me it is not loading them in individually (as in: loaded then loop, loaded, then loop ect.) as the updatePic is not traced until the loop is complete (am I wrong?).  How do I make sure I am loading in all of the images?  Without an error Im not sure if Im going the correct route here...

Thanks again...
var xmlData:XML = new XML();
var xmlList:XMLList = new XMLList();
var currentPic:int=0;
var xmlLoader:URLLoader = new URLLoader();
var loaders = new Array();

xmlLoader.addEventListener(Event.COMPLETE, onComplete);
xmlLoader.load(new URLRequest("xml/portfolio.xml"));

function onComplete(e:Event):void {
	trace("complete");
	xmlData=new XML(e.target.data);
	xmlData=new XML(xmlLoader.data);
	xmlList=xmlData.portfolio;
	loadImages();
}
var Length=xmlList.length();
function loadImages():void {
	trace("loadImages");
	
	for (var i = 0; i < xmlList.length(); i++) {
		trace("i = " + i);
		loaders[i] = new Loader();
		loaders[i].load(new URLRequest(xmlList.pic[i]));
		loaders[i].contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, progressHandler);
		loaders[i].contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);
		trace("xmlList.pic[i] = " + xmlList.pic[i]);
		addChild(loaders[i]);
		//updatePic(currentPic);
	}

}
function progressHandler(e:ProgressEvent):void {
	var percent:Number;
	var loaded:Number=0;
	var total:Number=0;
	for (var i in loaders) {
		loaded+=loaders[i].contentLoaderInfo.bytesLoaded;
		total+=loaders[i].contentLoaderInfo.bytesTotal;
	}
	percent=loaded/total;
	trace("bytesLoaded=" + loaded + " bytesTotal=" + total);
}
function loadComplete(index:int):void {
	trace("updatePic");
}

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of cubical38
cubical38

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
I was trying to accept my answer for future users to get the code but also award points to the expert.  All 500 points should be awarded to blue-genie.
award points to blue-genie.
hey no don't worry about it, go ahead and accept the answer yourself you did fix it yourself.