ActionScript 3.0 Design Patterns

(Chris Devlin) #1

174 | Chapter 4: Decorator Pattern


Creating the document and setting the stage


Once you’ve saved theDeal.asfile, you’ll need to do a little work on a Flash docu-


ment file. The following steps will guide you.



  1. Open a new Flash document and save it asAutoDealer.flain the same folder as
    the.as files.

  2. In the Document class window, type inDeal, and resave the file.

  3. Using Figure 4-8 as a guide, use Static text to add the header “2 Guys From Con-
    necticut Hybrid Cars.” Beneath the header, at horizontal position 150, type in
    Select Car, and on the same line at horizontal position 250, type inSelect
    Options.

  4. Open the Components and Library panels and drag a copy of the radio button
    and the checkbox to the Library.

  5. Select Insert➝Symbol in the menu bar, and select Button as Type. In the Name
    window, type inButton(which is the default name), and click the Import for
    ActionScript checkbox. Click OK to enter the Button Symbol editor indicated by
    the special four-frame Timeline.

  6. In the Button Symbol editor, add a layer, and, selecting the top layer, use the
    Rectangle Tool to draw a rectangle with colors to suit your tastes with 8-point
    rounded corners located at x=0, y=0. Size it to W=43, H=13. Add keyframes to
    all the frames in the top layer. Select the object in the Over frame and swap
    (reverse) the stroke and fill colors.

  7. Add keyframes to the first three frames in the lower layer. In the Up frame, using
    a Static text and narrow sans serif 10-point font type, type “Calculate” centered
    below the button. In the Over frame, do the same thing, but type inTotal Cost.
    Leave the Down frame empty.

  8. Check to make sure your Library shows the following: CheckBox, CheckBox-
    Skins, Component Assets, Button, RadioButton, RadioButtonSkins. If it does,
    you should be all set.


The next step is to test the application. All the buttons and the text field are auto-


matically placed on the stage. Figure 4-8 shows what you can expect to see if every-


thing is working as expected.


172 }

173 }

174 }

175

Example 4-48. Deal.as

Free download pdf