H  1  2  3  4.1  4.2  4.3  5  6  7  8  9 

Hands-On: Flash MX 2004 the Basics

Exercise 8: Adding On/Off Sound Buttons to the Dynamic Text Exercise

Continue with the previous exercise or re-open the dreamSpeech.fla file so you can add a Fixed Text Block to dress up the page and Sound On and Sound Off buttons that will play a part of Martin Luther King’s 1963 “I have a Dream” speech. All the files you need are already in the Library.

  1. Click the background layer on the Timeline and insert a new layer above it, rename this layer to bannerText.
  2. Using the Text Tool create a Static Fixed Text Block that is 670 pixels wide and 64 pixels tall, use the Properties Inspector panel to adjust the size after you draw the box.
  3. Type the following text using Verdana, 24pt, white, bold and centered. Type:
    Working with Dynamic Text and HTML
    ~ WAV Files and Sound Buttons ~
  4. Click the buttons layer and add a new layer above it, rename it speakers.
  5. The Align panel. In the first frame of the new speakers layer, open the Library and drag a soundOn and a soundOff button onto the Stage.
  6. Click the black selection arrow and then [Shift] click on both sound buttons.
  7. Use the Align panel [Control] + [K] to align the buttons, make sure the “to Stage” icon is not selected, and select the second button from the left on top, Align horizontal center.
  8. Click the speakers layer and add a new layer, it should be directly below the actions layer; rename it to soundActions.
  9. In the Timeline, select the second frame of each layer(use [Shift] click to select then), and press [F5] to add another frame to each layer. Your Timeline should look like the one shown here.
    The Timeline panels.
  10. In the soundAction layer, select the second frame and press [F6] to put in a keyframe.
  11. Select the soundOn button and then in the Properties Inspector panel type dreamspeech in the instance field.
    The Properties Inspector for Sound.
  12. Open the Library panel and locate the sound folder, double-click it open and then click once on the dream.wav file inside.
  13. Choose the Libraries Option button and choose Linkage to open the Linkage dialog box, type dream.wav as the Identifier. Place a check mark in Export for ActionScript and Export in first frame.
    The Linkage Properties dialog box.
  14. Select the Actions layer, click to the right of the ActionScript and then press [Enter] to add a new line of script. Choose Global Functions > Timeline Control > gotoAndPlay and then put a 1 inside of the parentheses (1). This will cause a loop back to frame 1 when pressed.
    Selecting the Actions from the Actions Panel.
    Viewing the Action code.
  15. The Load Sound from Library dialog box. With the soundOn button still selected and select the following from the Behaviors panel. Click Window > Development Panels > Behaviors or [Shift] + [F3].
  16. Click the Plus Sign +, located in the upper-left portion of the Behaviors panel, point to Sound, and then click Load Sound from Library.
  17. Enter the name of the audio file in the Linkage ID Field.
  18. Enter the instance field name you typed in the Properties panel dreamspeech.
  19. Select Play This Sound When Loaded. Click OK.
  20. Test the Movie, you file should begin to play when you press the soundOn button.
  21. Now you have to make the soundOff button work.
  22. Click the soundOff button on the Stage.
  23. Enter dreamspeech in the instance field name of the Properties panel just like you did for the soundON button.
    The Properties Inspector for the Sound On button.
  24. Click open the Behaviors panel and then click the Plus sign +, point to Sound, and then click Stop Sound.
  25. Enter the name of the sound instance in the sound instance field. Click OK.
    The Stop Sound Dialog box.
  26. Test your movie one more time, this time you can stop the .WAV file from playing too. Hopefully, your exercise looks like the one below, and that it works too!
  27. Save your work. In a future exercise you will want to optimize this file so it can be published for the Web.

The finished Web page project.

 

Download these files if you haven’t yet:

http://profal2.com/cis127/pdf/assets/flash/dreamSpeach.fla

http://profal2.com/cis127/pdf/assets/flash/dream.txt

 

Back to Top