Loading XML Data into Your Flash Presentations

If you know how to load the XML data from an XML file into a flash presentation then it will be easy for you to create presentations that are dynamic in nature. It is possible to change the contents of the XML file alone with an interface that allows you to give a different presentation when needed. For this reason it is better to understand the logic behind this task. To build confidence in you, you have to start with a simple application that loads the XML data in to flash. Flash has a XML object for this purpose.

<?xml version="1.0"?>
<books>
<item>
<bookname>Head Rush Ajax</bookname>
<author>Brett McLaughlin</author>
</item>
<item>
<bookname>Exalted</bookname>
<author>Alan Alexander</author>
</item>
</books>

Save the above file as books.xml in your hard drive.

The next step is to create a flash movie that can load the data from the XML file. Create a movie in flash and add text boxes to it using the text tool. From the properties panel for the text box, make sure you are selecting the dynamic text.

In our case you need two text fields to display the bookname and the author of the book. Name the text fields appropriately (bookname_txt, author_txt) and ensure that the width of the text fields is wide enough to display the text. If you know that the characters are more to be displayed then it is better to set the line-type to Multiline.

In the first frame of your movie you have to add the following code in the actions panel. You can press F9 to bring the actions panel up to add the code.

function loadXMLData(loaded) {
if (loaded) {
_root.bookname = this.firstChild.childNodes[0].childNodes[0].firstChild.nodeValue;
_root.author = this.firstChild.childNodes[0].childNodes[1].firstChild.nodeValue;
bookname_txt.text = _root.bookname;
author_txt.text = _root.author;
}
else {
trace("Could not load XML file");
}
}
xmlFile = new XML();
xmlFile.ignoreWhite = true;
xmlFile.onLoad = loadXMLData;
xmlFile.load("books.xml");

In the above code we are writing the code to navigate to the <bookname> and the <author> tags in the XML file. Then we are assigning the text in that node to the text box in the movie. These tasks are written in a function called the loadXMLData. The code logic is to create an XML object and using the load method of that object to load the books.xml file.

In the onload event we are firing the function that we have written to extract the XML data. If the xml file is not loaded then the else clause comes into action and displays the text “Could not load XML file”. If loading of the XML file is successful then the navigation in the XML file continues.

The ignoreWhite property of the XML object is used to ignore the white spaces within the XML file. This is needed since Flash may read the white spaces in the XML file if you are not using the MX version.

When we are using the load method of the XML object we have to use the exact path of the file to be loaded. In our case we are assuming that the flash movie and the xml file are in the same directory. Hence we have just given the name of the xml file alone.

In the function that navigates you should become familiar with the levels that are navigated. To extract value the .nodevalue is not used if you are using Flash MX and above. Note the change in the value of the index so that different values of the node are displayed.

This simple example will give you an idea of how to load an external xml file and extract data from it using flash. If you are good programmer you can alter the loadXMLData function to display all the nodes successively when the user clicks a next button. For this purpose you have to create the next and previous button and add actions to them accordingly so that you are navigating the next and the previous nodes in the XML file.