Adding XML data in Adobe Captivate Projects

I am always looking for ways that I can extend my Adobe Captivate projects but not only so that I can include cool features but also to save myself some time. One of the time saving features I have been looking at recently is integrating XML (Extensible Markup Language) into my project files. Let me start by painting my requirements picture. WebAssist had a number of product suites (Super Suite, Web Developer Suite and Web Designer Suite) that were on special offer, now imagine that I had created a product feature tour that describes each of the suites and I want to include the offer price for each of the product suites.

View the Adding XML Data into Adobe Captivate projects sample.

Whilst I could just add the prices using transparent text captions what would be a lot more efficient would be to store the prices somewhere else so that once the special offer has ended I can adjust the prices without having to republish my Adobe Captivate project file. XML is an idea format for storing the suite prices but, since you cannot link XML data directly into Adobe Captivate you have do have to be prepared to spend a little time in Adobe Flash the end results are worth the extra effort.

The first step is to create the XML document which is something that you can very easily do in Adobe Dreamweaver CS3 or even Notepad if you don’t to use an HTML Editor.

<?xml version="1.0" encoding= "UTF-8" ?>
<!-- xml document created by Mark Fletcher -->
<products>
<product product_name="Super Suite" price="449.99"></product>
<product product_name="Web Developer Suite" price="249.99"></product>
<product product_name="Web Designer Suite" price="149.99"></product>
</products>

The next step was to fire up Adobe Flash and insert all the graphics and insert the graphics I wanted to include in the document. In this case I inserted the WebAssist logo and suite box shots.

Because I wanted to load text from a file instead of adding just static text, I inserted some text boxes and then using the Properties inspector text type drop down menu I selected Dynamic Text and gave each of the text fields a title.

Now for the ActionScript code which is used to display the data. I should point out that there are other ways of working with XML in Flash which I might come back to at some point in the future, but, for now here my AS logic.

// create an XML object called "my_xml"

my_xml = new XML();

// load data from an external XML file into "my_xml" object

my_xml.load("wa_offers.xml");

// When the data has been loaded... Call a function ("my_function" in this case)

my_xml.onLoad = my_function;

// ignore "white spaces", text nodes that only contain white space are discarded

my_xml.ignoreWhite = 1;

// function contents

function my_function() {

// take the data from the XML lines (line 0,1,2) and place that data inside text fields

text_field_1.text = my_xml.firstChild.childNodes[0].attributes.product_name;

text_field_2.text = my_xml.firstChild.childNodes[1].attributes.product_name;

text_field_3.text = my_xml.firstChild.childNodes[2].attributes.product_name;

//

text_field_a.text = my_xml.firstChild.childNodes[0].attributes.price;

text_field_b.text = my_xml.firstChild.childNodes[1].attributes.price;

text_field_c.text = my_xml.firstChild.childNodes[2].attributes.price;

Having tested the ActionScript code actually works, I then published the Flash document and turned my attention to Adobe Captivate

To add the published Flash file, I simply inserted the exported SWF file as an animation

At first when I did this I honestly thought that this wasn't going to work since in Captivate the XML data is represented as "undefined" both in Edit view but more alarmingly when I previewed.

However, I decided to press on and see what would happen once I have published the Captivate file.

In order to get XML to work correctly I did find that I had to publish the project using Flash version 8 but once I had done this and made sure that my XML file (wa_offer.xml) was in the same folder as my published Flash files the data did show through correctly.

I have included the sample files below in case you want to experiment with this

Published SWF files and XML
Sample Flash File with ActionScript code