XML-meny (AS3)

Hej,

Har en del problem med XML (AS3). Har suttit på egenhand och försökt sy ihop påsen men det blir bara en hög med trassel av allt ihop.
Så tänkte att det är likabra att fråga så att det blir rätt från första början.

Jag vill göra följande (se längst ner för bifogad bildbeskrivning)

Här är min XML-kod:

<?xml version="1.0" encoding="utf-8"?>
<Stores>
	<Store>
		<title><![CDATA[Test 1]]></title>
		<link><![CDATA[/test1.html]]></link>
		<img_vert><![CDATA[img1_vert.jpg]]></img_vert>
	</Store>
	<Store>
		<title><![CDATA[Test 2]]></title>
		<link><![CDATA[/test2.html]]></link>
		<img_vert><![CDATA[img2_vert.jpg]]></img_vert>
	</Store>
	<Store>
		<title><![CDATA[Test 3]]></title>
		<link><![CDATA[/test3.html]]></link>
		<img_vert><![CDATA[img3_vert.jpg]]></img_vert>
	</Store>
</Stores>

Jag har kommit så långt att jag lyckats skapa mitt XML-objekt och ladda in bilderna (se kod nedan).

Dock är det i detta stadie min lycka verkar ta slut.

Min AS-kod:

// XML
// ===================================================

var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();

xmlLoader.addEventListener(Event.COMPLETE, LoadXML);

xmlLoader.load(new URLRequest("concept.xml"));

function LoadXML(e:Event):void {
	xmlData = new XML(e.target.data);
	ParseConcept(xmlData);
}

// FUNCTIONS
// ===================================================

function ParseConcept(StoreInput:XML):void {
	
	var StoreList:XMLList = StoreInput.Store;

	var imageLoader:Loader;
	var movieClipTemp:MovieClip;	
	for each (var StoreElement:XML in StoreList) {

		
		trace("Concept-XML Output");
		trace("-------------------------------------------------------");		
		trace(StoreElement.title);
		trace(StoreElement.link);
		trace(StoreElement.img_vert);
		trace("-------------------------------------------------------");
		
		
		imageLoader = new Loader();
		imageLoader.load(new URLRequest(StoreElement.img_vert));
		
		movieClipTemp = new MovieClip();
		addChild(movieClipTemp);
		
		movieClipTemp.addChild(imageLoader);
				
	}
	
}

Några av de problemen jag stött på:

• Hur/När kan jag känna av bredd/höjd på bilderna? Jag vill kunna placera dem en efter en under varandra likt en "meny".
• Hur skapar jag en listener som innehåller de unika värden från XML-filen. Dvs varje knapp går till en unik URL.

Då jag vill kunna scrolla knapparna antar jag att jag får placera samtliga i en container (mc). Kan man göra såhär:

[B]var mcContainer:MovieClip;
mcContainer = new MovieClip();
addChild(mcContainer);
[/B]
		
// XML
// ===================================================

var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();

xmlLoader.addEventListener(Event.COMPLETE, LoadXML);

xmlLoader.load(new URLRequest("concept.xml"));

function LoadXML(e:Event):void {
	xmlData = new XML(e.target.data);
	ParseConcept(xmlData);
}

// FUNCTIONS
// ===================================================

function ParseConcept(StoreInput:XML):void {
	
	var StoreList:XMLList = StoreInput.Store; 
	
	var imageLoader:Loader;
	var movieClipTemp:MovieClip;
	
	for each (var StoreElement:XML in StoreList) {

		trace("Concept-XML Output");
		trace("-------------------------------------------------------");		
		trace(StoreElement.title);
		trace(StoreElement.link);
		trace(StoreElement.img_vert);
		trace("-------------------------------------------------------");
		
		imageLoader = new Loader();
		imageLoader.load(new URLRequest(StoreElement.img_vert));
		
		movieClipTemp = new MovieClip();
		[B]mcContainer.addChild(movieClipTemp);[/B]
		
		movieClipTemp.addChild(imageLoader);
		
		
	}
	
}

Skulle någon vänlig själ kunna ge mig lite hjälp på traven.
Fungerar den as-kod jag har i nuläget för att bygga vidare på eller bör man göra på något annat sätt?
Någon som kan ge mig svar på de frågor jag ställt ovan?

Tusen tack!

Vänliga hälsningar / E

Det finns en massa bra tutorials på detta.
Sök på google samt ex. kirupa.com och actionscript.org

Kan ta en titt på din kod senare också.

doridori skrev:

Det finns en massa bra tutorials på detta.
Sök på google samt ex. kirupa.com och actionscript.org

Kan ta en titt på din kod senare också.

Tro mig jag är inte den som ställer en fråga innan jag "googlat" :)

#L# skrev:

Tro mig jag är inte den som ställer en fråga innan jag "googlat" :)

Nähä okej, vad bra.

Då har du såklart redan provat den här och den här tutorialen utan framgång?
Kolla på dem annars ;)

För att svara på dina frågor:
Du kan komma åt alla egenskaper för bildobjektet när det är färdiginladdat.
När ett Loader-objekt har laddat klart skickar det ut ett complete-event som du kan fånga upp och där komma åt alla egenskaper för Loader-objektet och dess innehåll.
Events skickas ut av Loader-objektets ContentLoaderInfo-objekt.

imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);

function loadComplete(e:Event):void
{
     // e.target är det objekt som skickat ut eventet, i detta fall imageLoader.contentLoaderInfo
     // för att komma åt Loader-objektet finns en loader-egenskap på contentLoaderInfo
     // och för att komma åt det inladdade innehållet har Loader-objektet egenskapen content
     var image = e.target.loader.content;

     trace(image.width, image.height);
}

Prova att lägga ovanstående kod i din for-loop och undersök hur du kommer åt dina inladdade bilder och i vilken ordning.

När det gäller att skilja och komma åt en bilds motsvarande URL:s finns det lite olika tillvägagångssätt.
Det enklaste sättet, särskilt som du redan använder ett MovieClip för varje bild, är att sätta nya egenskaper på själva thumb-objektet.
Det fina med MovieClip-objekt är att man kan sätta vilka egenskaper man vill.
I din kod kan du använda movieClipTemp till detta.

// (inuti for-loopen)
movieClipTemp = new MovieClip();
movieClipTemp.title = StoreElement.title;
movieClipTemp.link = StoreElement.link;
// etc.

// Och för att komma åt dessa värden senare:
movieClipTemp.addEventListener(MouseEvent.CLICK, thumbClick);

function thumbClick(e:MouseEvent):void
{
     trace("Image title: " + e.target.title);
}

Det här är väl något av en fullösning egentligen, men den funkar och det är ju huvudsaken! =)

Skulle man göra på riktigt sätt kanske man skulle spara referenser i en Array eller liknande, alternativt att man skriver en egen Thumb-klass som kan innehålla information från XML:en.

Hoppas detta hjälper något.
Jag har rabblat upp allt rätt ur Flashminnet (ursäkta uttrycket?) så det är möjligt att något blivit tokigt. Isåfall får du fråga på.

För övrigt har jag faktiskt gjort ett eget bildgalleri nyligen, det kanske kan vara intressant att kolla på?
Det finns isåfall att se på erikedhagen.com
Bilderna hämtas live från Flickr via XML.