Using ActionScript 2.0 Components
Creating an Application with Components > Create the checkout screen

Create the checkout screen

When the user clicks the Checkout button on the main screen, the Checkout screen appears. The Checkout screen provides forms where the user can enter billing, shipping, and credit card information. The checkout screen looks like the following:

The checkout interface consists of components placed on a keyframe at Frame 10 in the application. You will use the Accordion component to create the checkout interface. The Accordion component is a navigator that contains a sequence of children that it displays one at a time. You will also add a Button component instance to create a Back button, so users can return to the main screen.

Later in the tutorial, you will create movie clips to use as children in the Accordion instance, to display the Billing, Shipping, and Credit Card Information panes.

1. In the main Timeline for the application, move the playhead to Frame 10 (labeled Checkout). Make sure the Form layer is selected.
2. Insert a blank keyframe on Frame 10 in the Form layer (select the frame and select Insert > Timeline > Blank Keyframe).
3. With the new keyframe selected, drag an instance of the Accordion component from the Components panel onto the Stage. In the Property inspector, enter checkout_acc for the instance name. Set the width to 300 pixels and the height to 200 pixels.
4. Drag an instance of the Button component from the Components panel onto the lower-right corner of the Stage. In the Property inspector, enter back_button for the instance name. Click the Parameters tab, and enter Back for the label property.

View comments on LiveDocs