Thu Dec 3 04:27:03 2009
Compared to AS2 parsing XML in ActionScript 3 is a dream, since it uses E4X (ECMAScript for XML) which is a programming language extension that gives AS3 native support for XML. Once an XML file is loaded, pulling specific data out of the returned xml data is a sinch. Also, I've added a bonus class that will make parsing XML even easier. You don't want to miss this one.
First off, take a look at this.
package
{
import flash.display.*;
import flash.events.*;
import flash.net.*;
public class NormalParsing extends MovieClip
{
private var ldr:URLLoader = new URLLoader();
private var xml:XML;
private var xmlList:XMLList;
public function NormalParsing()
{
ldr.load(new URLRequest("bin/data.xml"));
ldr.addEventListener(Event.COMPLETE, loaded);
}
private function loaded(event:Event):void{
xml = XML(event.target.data);
xmlList = xml.children();
trace("*************** XML ***************n"+xml);
trace("*************** XMLList ***************n"+xmlList);
}
}
}
The above code is all the code you need to load a xml file using ActionScript. Here's how it works. First we create a new URLLoader instance on line 9 and inside the constructor function we load a new URLRequest passing in the string "bin/data/xml", which is the location of our XML file (lines 15). We add an EventListener (line 16) to the loader and listen for the COMPLETE event which will call the loaded function on line 19 once the XML file has been fully loaded. The XML file itself may only take a few milliseconds to load but trying to access any properties or functions that involve the information being loaded before the information is fully available will more often than not cause errors of doom, so make sure that you add the listener and wait for the load to complete. Finally, with all the data loaded we put the XML data returned into the xml variable defined on line 20 and the children of the XML (xml.children()), which is another way of talking about the XMLList, inside the xmlList variable define on line 21.
After that, the information can then be accessed from inside those two variables as the trace statements at the end of the loaded function prove.
The structure of the XML is the same as the XML file used in the jQuery XML parsing example in a previous post. There is a list tag, inside of which are a few item tags including an 'id' attribute. Each item tag holds a head and url tag. So how do we access this information specifically. The answer is simple. We use E4X.
For example, if we wanted to access the 'id' attribute from the xml variable, we would use the following syntax.
xml[n].attribute("attribute name");
The number written in place of 'n' represents the position inside the XML and this always starts at 0. Therefore, if we wrote xml.item[0].attribute('id'); inside of a trace statement, the first 'id' attribute value would be returned, which in this case is "1"; If we wrote xml.item[2].attribute('id');, the attribute value "3" would be returned.
To access the head tags in the XML, we would use the following syntax.
xml.item[0].head //returns CuluCulu Flash
xml.item[3].head //returns Gakushu Support Juku
To return the url tag we would use the following syntax.
xml.item[0].url //returns http://www.culu-culu.com/culuculu/flash
xml.item[3].url //returns http://www.supportjuku.com
Parsing XMLList data is done in a very similar way, but this time we will be replacing xml.list[n] with xmlList[n]. Also, to access the 'id' attribute in the XMLList you would use an @ mark instead of the word 'attribute' as was the case when accessing attributes in XML data. For example:
xmlList[2].url //returns http://www.supportjuku.com
xmlList[0].@id) //returns 1
As you can see, E4X is a very powerful tool and is one that will take your coding leaps and bounds.
To finish off though, I would like to introduce you to a quick class I whipped up that uses a public static function to parse XML data, meaning that it doesn't require instantiation. You can download my XMLParsing class here.
It's implementation is very straight forward. Simply import the class using the statement import XMLParsing and then use the remote method to pass in the url to your XML file, and finally add an EventListener to listen for the complete call. Example code is as follows.
import XMLParsing;
XMLParsing.remote("data.xml");
XMLParsing.addEventListener(Event.COMPLETE, init);
function init(event:Event):void{
trace(XMLParsing.xml);
trace(XMLParsing.xmlList);
}
As you can see from the code above, you can access the xml and xmlList variables to access whatever data you want. When working on big projects, however, it might be a good idea to store these variables inside variables of the class importing the XMLParsing class, as a new remote call will change the data stored in the XMLParsing class. So, there you go. I think some of you may find it useful. Let me know how you get on. All files for this post can be download here
