?
Solved

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

Posted on 2010-08-12
11
Medium Priority
?
855 Views
Last Modified: 2013-11-11
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!

0
Comment
Question by:cubical38
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 4
11 Comments
 
LVL 39

Expert Comment

by:blue-genie
ID: 33428172
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.
0
 

Author Comment

by:cubical38
ID: 33429712
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;

?
0
 
LVL 39

Expert Comment

by:blue-genie
ID: 33429755
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.

0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:cubical38
ID: 33429846
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...
0
 
LVL 39

Expert Comment

by:blue-genie
ID: 33430446
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.
0
 

Author Comment

by:cubical38
ID: 33434618
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

0
 

Accepted Solution

by:
cubical38 earned 0 total points
ID: 33434854
update, success...
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]));
		loaders[i].contentLoaderInfo.addEventListener(Event.COMPLETE, updatePic);
		addChild(loaders[i]);
		updatePic(currentPic);
		if (i == 0){
			loaders[i].x=0;
		} else {
			loaders[i].x=loaders[i-1].x + 622;
		}
	}

}

Open in new window

0
 

Author Comment

by:cubical38
ID: 33801005
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.
0
 

Author Comment

by:cubical38
ID: 33801012
award points to blue-genie.
0
 
LVL 39

Expert Comment

by:blue-genie
ID: 33803229
hey no don't worry about it, go ahead and accept the answer yourself you did fix it yourself.
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my long career of working as an actionscript developer, I had spent sleepless night often working hard to solve some small problems which actually took a lot of my development time; later found out the solutions to be a line or two. Here are s…
I have found that much of my time doing support ends up being a constant repetition of the same steps to different people.  Early on I stated using web pages with Frequently Asked Questions (FAQs) to alleviate most of the burden.  Sometimes this jus…
The goal of the tutorial is to teach the user how to how to load their YouTube profile onto Flash Media Live Encoder.
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.
Suggested Courses
Course of the Month11 days, 19 hours left to enroll

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question