Introduction to Components Tutorial > Create a form > Add components

 

Add components

The first step is to add the components to the Stage and place them on the form. You will add a check box, a combo box, and a push button to the first page of the form. You will also add a push button to the second page.

To add components to a document, you can either drag elements from the Components panel to the Stage, or double-click them in the Components panel to place them in the center of the Stage. After you add a component to a document, it appears in the document's Library panel.

It is a good idea to create a new layer for the components.

1

Choose File > Open and navigate to the Flash MX program directory. Open Tutorials/Components/my_sweepstakes/mysweepstakes.fla.

2

Choose File > Save As and save the file with a new name, such as newsweepstakes.

3

Create a new layer and name it UI. You will place the components on this layer.

4

Click Frame 6 in the UI layer of the Timeline. Choose Insert > Blank keyframe to add a blank keyframe. This will be used for components on the second page.

5

Make sure the following panels are open:

Library panel (Window > Library)

Components panel (Window > Components)

Property inspector (Window > Properties)

 
Add a check box

Use the CheckBox component to create a box with a value of either true or false.

1

Select Frame 1 in the UI layer.

2

Drag the CheckBox component from the Components panel to the Stage. Place it under the paragraph that asks if the user wants to enter the sweepstakes.

The component appears in the Flash UI Components folder in the Library panel.

 
Add a combo box

Use the ComboBox component to create a simple drop-down menu of items that can be selected by users. You can also use a ComboBox to build a more complex drop-down menu that automatically scrolls to a menu item starting with the letter or letters entered into the text field by the user.

Drag the ComboBox component from the Components panel to the Stage. Place it under "Select your favorite color:".

The component appears in the Flash UI Components folder in the Library panel.

 
Add push buttons

Use the PushButton component to create two push buttons. One button will be on the first page and will be used to submit the information on the form. The next button will be on the second page and will be used to return to the first page and repopulate it with the values that were previously submitted.

1

Drag the PushButton component from the Components panel to the Stage. Place it in the lower right corner of the form so it lines up horizontally with the name and e-mail text fields.

The component appears in the Flash UI Components folder in the Library panel.

After you have dragged a component from the Components panel to the Stage, you select additional instances of it from the Library panel.

2

Go to the blank keyframe at Frame 6. In the Library panel, open the Flash UI Components folder and drag the PushButton component from the Library panel to the Stage. Place it in the lower right corner.