User Guide

Accordion component (Flash Professional only) 97
Using the Accordion component (Flash Professional only)
You can use the Accordion component to present multipart forms. For example, a three-child
accordion might present forms where the user fills out her shipping address, billing address, and
payment information for an e-commerce transaction. Using an accordion instead of multiple web
pages minimizes server traffic and allows the user to maintain a better sense of progress and
context in an application.
Accordion parameters
You can set the following authoring parameters for each Accordion component instance in the
Property inspector or in the Component inspector:
childSymbols is an array that specifies the linkage identifiers of the library symbols to be used to
create the accordion’s children. The default value is
[] (an empty array).
childNames is an array that specifies the instance names of the accordion’s children. The values
you enter will be the instance names for the child symbols you specify in the childSymbols
parameter. The default value is
[] (an empty array).
childLabels is an array that specifies the text labels to use on the accordion’s headers. The default
value is
[] (an empty array).
childIcons is an array that specifies the linkage identifiers of the library symbols to be used as the
icons on the accordion’s headers. The default value is
[] (an empty array).
You can write ActionScript to control additional options for the Accordion component using its
properties, methods, and events. For more information, see “Accordion class (Flash Professional
only)” on page 105.
Creating an application with the Accordion component
In this example, an application developer is building the checkout section of an online store. The
design calls for an accordion with three forms in which a user enters a shipping address, a billing
address, and payment information. The shipping address and billing address forms are identical.
To use screens to add an Accordion component to an application:
1. In Flash, select File > New and select Flash Form Application.
2. Double-click the text Form1, and enter the name addressForm.
Although it doesn’t appear in the library, the addressForm screen is a symbol of the Screen
class. Because the Screen class is a subclass of the View class, an accordion can use it as a child.
3. With the form selected, in the Property inspector, set the form’s visible property to false.
This hides the contents of the form in the application; the form only appears in the accordion.
4. Drag components such as Label and TextInput from the Components panel onto the form to
create a mock address form; arrange them, and set their properties in the Parameters tab of the
Component inspector.
Position the form elements in the upper left corner of the form. This corner of the form is
placed in the upper left corner of the accordion.