User Guide
24 Chapter 2: Creating an Application with Components (Flash Professional Only)
4.
Make sure the Form layer is selected. In the Components panel (Window > Development
Panels > Components), locate the ComboBox component in the UI Components folder. Drag
an instance of ComboBox onto the Stage. Place it below the What Did You Do? text. In the
Property inspector (Window > Properties), for the instance name enter problems_cb. Set
Width to 400 pixels.
Notice that the ComboBox component symbol is added to the library (Window > Library).
When you drag an instance of a component to the Stage, the compiled clip symbol for the
component is added to the library. As with all symbols in Flash, you can create additional
instances of the component by dragging the library symbol onto the Stage.
5.
Drag an instance of the DataGrid component from the UI Components folder in the
Components panel onto the Stage. Place it below the Gift Ideas text. Enter products_dg for the
instance name. Set Width to 400 pixels and Height to 160 pixels.
6.
Drag an instance of the DataSet component from the Data Components folder in the
Components panel onto the side of the Stage. (The DataSet component does not appear in the
application at runtime. The DataSet icon is simply a placeholder that you work with in the
Flash authoring environment.) Enter products_ds for the instance name.
7.
Drag an instance of the XMLConnector component from the Data Components folder in the
Components panel to the side of the Stage. (Like the DataSet component, the XMLConnector
component does not appear in the application at runtime.) Enter products_xmlcon for the
instance name. Click the Parameters tab in the Property inspector, and enter http://www.flash-
mx.com/mm/firstapp/products.xml for the
URL property.
Note: You can also use the Component inspector (Window > Development Panels > Component
Inspector) to set parameters for components. The Parameters tab in the Property inspector and
the Component inspector work in the same way.
The URL specifies an external XML file with data about the products that appear in the Gift
Ideas section of the application. Later in the tutorial you’ll use data binding to bind the
XMLConnector, DataSet, and DataGrid components together; the DataSet component will
filter data from the external XML file, and the DataGrid component will display it.
8.
Drag an instance of the Button component from the UI Components folder in the Components
panel onto the Stage. Place it in the lower right corner of the Stage. Enter checkout_button for
the instance name. Click the Parameters tab and enter
Checkout for the label property.
9.
Drag an instance of the Window component from the UI Components folder in the
Components panel onto the Stage. Select the instance on the Stage and delete it.
The Window component symbol is now added to the library. Later in the tutorial, you’ll create
instances of the Window component using ActionScript.
Remember to save your work frequently.