Introduction to XML in Flash

In this tutorial, we will show how to edit an external data file that has been created in tandem with a Flash applet. The advantage of this approach is the flexibility that it allows for the finished applet file.  With this technique, a single applet file can be used to host multiple activities or problem sets.  Even more importantly, an instructor who knows nothing of Flash programming can customize an application for his or her own needs.

Part 1: Before and After Comparison.  Let’s pretend that you have browsed the Math Flash Forum site and come across a mathlet written by Ensley & Kaskosz called Polar Curves.  The application is the straightforward polar curve graphing utility shown below:

“Very nice,” you think.  “That Ensley & Kaskosz are very clever, but I wish this application had some built-in examples for my students who are just learning about polar curves.”  At the end of this workshop, we will show how we modified the above program to accomplish this goal. The key is to tell the applet to pull data from an external file that can be edited with any text editor. Then the instructor can simply change the data to change the applet content.

Part 2. Adding a "Gallery" component

Part 3. Editing an XML data file

According to the World Wide Web Consortium (http://www.w3.org), ... Extensible Markup Language (XML) is a simple, very flexible text format derived from SGML (ISO 8879). Originally designed to meet the challenges of large-scale electronic publishing, XML is also playing an increasingly important role in the exchange of a wide variety of data on the Web and elsewhere.

If you have used HTML before, then the format of XML will look very familiar to you.  The only difference is that in XML, you can create your own tags and tag attributes to make sense for your particular application.  Open a text file (say, using Notepad on a Windows machine) and enter the following text to reflect the information required to completely specify two examples in the Polar Grapher application.

<gallery>

<plot func="1 + 2*sin(t)">
<xRange min= "-3.5" max="3.5" />
<yRange min= "-3.5" max="3.5" />
<tRange min= "0" max="2*pi" />
</plot>

<plot func="t/4">
<xRange min= "-4" max="4" />
<yRange min= "-4" max="4" />
<tRange min= "0" max="5*pi" />
</plot>

</gallery>

The tags <gallery>, <plot>, etc. and the attributes func, min and max are all invented in order to convey the meaning of the data.  ActionScript 3.0 allows the manipulation of this data in a manner that is entirely intuitive. The notes below explain particulars...

Explanation of XML tags and attributes

Save this file as gallery.xml in the same directory that your html and swf files will eventually reside.