User Guide

256 Chapter 14: Data Integration (Flash Professional Only)
Creating a simple application
The following example walks you through creating a simple data integration application, which
can help you understand the concepts and steps involved.
In the example, you create a simple application that loads and displays a dinner menu. You load
an XML file, which you’ll use both as a data source and as a sample for the data source’s schema.
The UI consists of a data grid, into which the XML data is loaded, and a button that loads the
data. Data binding is supported only between components that exist in Frame 1 of the main
Timeline, Frame 1 of a movie clip, or Frame 1 of a screen; in this example, the components all
reside in Frame 1 of the main Timeline.
To create the dinner menu application:
1. Copy the data source, an XML file called dinner_menu.xml, from the
\Samples\HelpExamples\dinner_menu folder, and save it in a new folder, Dinner Menu, on
your hard drive.
2. In Flash, create a new Flash document and save it as dinner_menu.fla in the Dinner Menu
folder you created in step 1.
3. Create the user interface, which consists of two components—a button that triggers data
retrieval and a data grid to display the data:
a Add a DataGrid instance named menu_dg to the stage with width 540 and height 240.
b Add a Button component instance named loadData below the data grid labeled Load Data.
4. Add the data components—an XMLConnector component to connect to the
dinner_menu.xml file and a DataSet component to bind that data to the data grid:
a Add an XMLConnector component instance named xmlConn.
b Add a DataSet component instance and name it menu_ds.
The data components do not have to be on the Stage; they don’t appear at runtime.
5. Set parameters for the XMLConnector component: select the XMLConnector component and,
in the Component inspector, click the Parameters tab, enter
dinner_menu.xml for the URL,
and select
receive for the direction. (Because the XML file is in the same folder as the FLA file,
the fully qualified path is simply the XML filename.)
6. Load a sample of the data source’s schema: click the Schema tab, select results, click Import
a Schema from a sample XML file, and select the dinner_menu.xml file.
The schema appears in the Schema tab.
7. Expose the XMLConnector’s array property for data binding and bind it to the DataSet’s
dataProvider property. With the XMLConnector component selected, follow these steps:
a On the Bindings tab of the Component inspector, click the plus (+) sign and in the dialog
box, select
food:array.
b On the Bindings tab again, click Bound To, click the magnifying glass icon, select DataSet,
and select
dataProvider:Array.
Each time you create a binding, you perform at least these two basic steps.