Adding Actions and a Button to Your Movie
Stopping the Action
If you published your movie now, the car would start moving as soon as the viewer entered the screen. You want the viewer to click on a button to make the car move. In this exercise you will add a behavior to stop any action before the viewer clicks a button. Later, you will add a button for the viewer to click to start the action. You will use behaviors to control the action. Generally you use ActionScript, a scripting language, to control the action in a Flash document. However, behaviors allow you to control some actions even if you do not know ActionScript.
Stop the Action
Add a new layer:
- Click the Horn layer to make it the active layer.
- Choose Insert > Timeline > Layer from the menu to add a new layer.
- Choose Modify > Timeline > Layer Properties from the menu (or double click the layer name and type in the new name). The Layer Properties dialog box opens. Type Stop Action in the Name field.
- Click OK.
Add a stop behavior:
- Choose the Selection tool.
- Click Frame 1 on the Stop Action layer.
- Choose Window > Behaviors from the menu.
- Click the plus sign in the Behavior panel.
- A context menu opens. Choose Movieclip > Goto and Stop at Frame or Label.
- The Goto and Stop at Frame or Label dialog box opens.
- Make sure there is a 1 in the Frame number field. This tells Flash to stop at Frame 1.
- Your behaviors panel should now look like this:
Play the Movie
- Choose Control > Test Movie from the menu to play the movie. Your car should not move.
- Click the Close button to return to Flash.
Adding a Button Buttons have four states: up, over, down, and hit.
|
| Up |
The appearance of the button when the pointer is not over it |
| Over |
The appearance of the button when you place the pointer over it |
| Down |
The appearance of the button when you click it |
| Hit |
Defines the area that will respond to a click of the mouse |
You want to create a button that is navy in the up state, green in the over state, and brown in the down state.
Create a New Layer
- Click the Horn layer to make the Horn layer the active layer.
- Choose Insert > Timeline > Layer from the menu to create a new layer.
- Choose Modify > Timeline > Layer Properties from the menu.
- Type Button in the Name field to name the layer button.
- Click OK.
Take the Start Button from the Library
- Move to the Library. If the Library panel is not open, choose Window > Library from the menu.
- Click on the icon next to Start Button and drag the Start Button onto the Stage.
- Resize it and place it at the bottom right of the stage as shown below:
Edit the Symbol
- With the selection tool click on the button to select it.
- Choose Edit > Edit Symbols from the menu to change to the symbol-editing mode.
The Over Frame
- Choose the Selection tool.
- Click the Over frame to select it.
- Choose Insert > Timeline > Keyframe from the menu.
- The Over frame becomes a keyframe as indicated by a black dot.
- Click the button to deselect it.
- Click the Fill color box and select green to change the fill color to green
.
- Your button should now be green in the Over Frame position.
The Down Frame
- Click the Down frame to select it.
- Choose Insert > Timeline > Keyframe from the menu.
- With the button still selected, click the Fill color box and select brown to change the fill color to brown.
The Hit Frame
- Click the Hit frame to select it.
- Choose Insert > Timeline > Keyframe from the menu.
- Choose Edit > Edit Document from the menu. You have created a button.
Add the Goto and Play Behavior:
- Choose the Selection tool.
- Click the button to select it.
- Choose Window > Behaviors from the menu if the Behaviors panel is not open.
- Click the plus sign in the Behavior panel. A context menu opens.
- Choose Movieclip > Goto and Play at Frame or Label. The Goto and Play at Frame or label dialog box opens.
- Make sure there is a one in the Frame number field.
- Click OK.
Test the Movie
- Choose Control > Test Movie from the menu. The Test Movie window opens.
- Click the Start Button to make the car roll.
- Close the window.
The Text Tool
You need to put a label on the Start Button and add a title to the movie. You will use the Text tool for this.
Add Text to the Button
- Click the Text tool to select it
.
- Choose Text > Font from the menu and select a font. I used Arial Black.
- Choose Text > Size > 24 from the menu to set the font size to 18.
- Click the Fill color box and select gold as the color.
- Type Start Movie on the button.
- Click anywhere outside the Stage to close the text box.
- Use the Selection tool to adjust the placement of the text. Remember, you can also use the arrow keys to change the placement.
- Click anywhere outside the Stage to deselect the text box.
Add a Title Choose the Text tool.
- Choose Text > Size > 24 from the menu.
- Click the lower left corner of the Stage.
- Type My First Movie. Click anywhere outside the Stage.
Test the Movie
- Choose Control > Test Movie from the menu. The Test Movie window opens.
- Click the Start Movie button. The movie should play.
