10.12.2012 Views

ActionScript 3.0 Design Patterns.pdf - VideoTutorials-bg.com

ActionScript 3.0 Design Patterns.pdf - VideoTutorials-bg.com

ActionScript 3.0 Design Patterns.pdf - VideoTutorials-bg.com

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

Example 4-48. Deal.as<br />

172 }<br />

173 }<br />

174 }<br />

175<br />

Creating the document and setting the stage<br />

Once you’ve saved the Deal.as file, you’ll need to do a little work on a Flash document<br />

file. The following steps will guide you.<br />

1. Open a new Flash document and save it as AutoDealer.fla in the same folder as<br />

the .as files.<br />

2. In the Document class window, type in Deal, and resave the file.<br />

3. Using Figure 4-8 as a guide, use Static text to add the header “2 Guys From Connecticut<br />

Hybrid Cars.” Beneath the header, at horizontal position 150, type in<br />

Select Car, and on the same line at horizontal position 250, type in Select<br />

Options.<br />

4. Open the Components and Library panels and drag a copy of the radio button<br />

and the checkbox to the Library.<br />

5. Select Insert ➝ Symbol in the menu bar, and select Button as Type. In the Name<br />

window, type in Button (which is the default name), and click the Import for<br />

<strong>ActionScript</strong> checkbox. Click OK to enter the Button Symbol editor indicated by<br />

the special four-frame Timeline.<br />

6. In the Button Symbol editor, add a layer, and, selecting the top layer, use the<br />

Rectangle Tool to draw a rectangle with colors to suit your tastes with 8-point<br />

rounded corners located at x=0, y=0. Size it to W=43, H=13. Add keyframes to<br />

all the frames in the top layer. Select the object in the Over frame and swap<br />

(reverse) the stroke and fill colors.<br />

7. Add keyframes to the first three frames in the lower layer. In the Up frame, using<br />

a Static text and narrow sans serif 10-point font type, type “Calculate” centered<br />

below the button. In the Over frame, do the same thing, but type in Total Cost.<br />

Leave the Down frame empty.<br />

8. Check to make sure your Library shows the following: CheckBox, CheckBox-<br />

Skins, Component Assets, Button, RadioButton, RadioButtonSkins. If it does,<br />

you should be all set.<br />

The next step is to test the application. All the buttons and the text field are automatically<br />

placed on the stage. Figure 4-8 shows what you can expect to see if everything<br />

is working as expected.<br />

174 | Chapter 4: Decorator Pattern

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!