Creating an XML Slideshow in Flash - Page 2

By Blue_Chi | Flash CS3 | ActionScript 1/2 | Advanced | Page 1, 2, 3, 4, 5, 6

The second step in creating our slideshow is loading and processing the XML data. Once we do that, we will also store the data we need in easily accessible variables. This entire process should be a breeze if you have read our tutorial on using XML in Flash. Here is a basic outline of what we will do in this section:

  1. Create an instance of the XML Class.
  2. Load the XML file using the XML Class instance.
  3. Store the required information in easily accessible variables.

Creating an instance of the XML class

The first segment of code we will write will simply create a new instance of the XML class to be used to load our XML file into Flash. We have to set its .ignoreWhite property to true in order for Flash to understand the XML file properly then will use the .load method to load our file.

var myShowXML = new XML();
myShowXML.ignoreWhite = true;
myShowXML.load("slideshow.xml");

We need to retrieve all the information we need from the XML file. We will do this by retrieving the values of all the attributes of the .firstChild of our XML file, which is the <slideshow> element. We will also make a reference to the array of elements that contains all the .childNodes of the <slideshow> element, i.e. the <image /> elements:

myShowXML.onLoad = function() {

_root.myWidth = myShowXML.firstChild.attributes.width;
_root.myHeight = myShowXML.firstChild.attributes.height;
_root.mySpeed = myShowXML.firstChild.attributes.speed;

_root.myImages = myShowXML.firstChild.childNodes;
_root.myImagesNo = myImages.length;

};

The .childNodes property of the <image> element is an array containing a reference to all the elements within that tag (the <image /> elements). This reference will be used later to extract the individual image specific details such as the URL and the title. The number of images is determined by accessing the .length property of the .childNodes array, which is then stored in the _root.myImagesNo variable.

All of our variables were created with the _root prefix so that they are attached to the _root of our movie clip in order to make referring to them easy regardless of the scope from which the movie clip is attempting to retrieve them from.

No further reference will be made to the XML file, except for loading the specific image details, and that will be made through the myImages variable and not directly from the XML file. We have completed this section of the tutorial and will work in the next section to create the container movie clip of our slideshow.

Summary of this Page

  1. Created an instance of the XML class and named it myShowXML.
  2. Used the myShowXML instance to load the XML file.
  3. Stored all the information we needed from the XML file in variables attached to the _root of SWF file to make reference to them easy.

In the next section we will create the container movie clip that will hold all of the images to be loaded in our slideshow.

Next page