The Best Structure for your Flash Site - Page 3
       by Mark Angeletti  |  16 June 2006

Frame 2
To recap, what was the main purpose of frame 1? If you said, "Global variables", you get a gold star. If not, run down to Starbucks and get some coffee and come back.

The main purpose of frame 2 is to gather external data -- typically, literal files in the form of XML. If you haven't looked at our navigation XML file, this would be a good time to do so. This article is not intended to teach you XML, so just take a look at the structure and what's in there. We have a total of 4 buttons; each button is assigned an image, some text and a link.

A note to all you non-Flash 8 users: you won't be able to use a PNG image. You'll have to use the provided JPEG image and make the changes in the XML file. Previous versions of Flash are only able to load JPEG files.

Now, let's look at the code in frame 2. I'll break it down as we go.

var xmlData:XML = new XML();

We start by instantiating a new XML object and call it xmlData. The XML object contains all the methods and properties we will need in order to work with XML data in Flash.

xmlData.ignoreWhite = true;

Flash will read all spacing contained within the XML file, including empty text nodes. As this is not the desired result, we simply tell Flash to ignore white space.

xmlData.load( xmlFile );

This line loads an XML document from the specified URL. Remember, xmlFile was declared in frame 1 and set to "navigation.xml." Because our FLA file resides in the same directory as our XML file, we need only give the name. Had our XML file been located in a directory other than the one that houses our FLA file, we'd have included a relative path.

The load process is asynchronous; it does not finish immediately after the load() method is executed. When the load() method is executed, the XML object property loaded is set to false. When the XML data finishes downloading, the loaded property is set to true, and the onLoad event handler is invoked.

xmlData.onLoad = loadXML;

Here we set the onLoad event handler to call our function loadXML. Let's look at the function:

This function runs only when the XML file has finished downloading and the loaded property is set to true.

If the XML file has completed loading, we execute the following code:

var xnRootNode:XMLNode = this;

We create an XML node variable (xnRootNode) and set it equal to this; this being the XML data that was just loaded.

nTotalButtons = xnRootNode.firstChild.childNodes.length;

At this point we need to talk about searching our XML to locate the values we need.

1 | 2 | 3 | 4 | 5 | 6 | 7




SUPPORTERS:

kirupa.com's fast and reliable hosting provided by Media Temple.