Before you begin work on your own movie, view a completed version of this tutorial to get an idea of what you’ll create. Additionally, the completed tutorial lets you examine the Timeline, Movie Explorer, Stage, and Actions panel to understand authoring practices.
Within your Flash MX application folder, browse to Tutorials/ActionScript/Finished.
Double-click puzzle.swf to open the completed movie in the stand-alone Flash Player.
2 In the puzzle.swf movie, click the OK button. The puzzle pieces scramble.
3 Click all the Show/Hide buttons. Notice how the different patterns and piece numbers are displayed to guide you in completing the puzzle.
4 Click a puzzle piece and drag it to the solution area. The piece snaps into place.
5 Shift-click a puzzle piece. The piece number appears in the circle under the solution area. You can match the piece number to its location in the piece number guide if you get stuck.
6 Alt-click (Windows) or Option-click (Macintosh) a puzzle piece. The piece rotates clockwise.
7 When you finish viewing the SWF file, you can either close the window or leave it open to serve as a reference.
Analyze the puzzle.fla file
It’s helpful to analyze the completed FLA file to determine how the author put it together and where the ActionScript elements are located.
1 In Flash, choose File > Open. Within your Flash MX application folder, browse to Tutorials/ ActionScript/Finished and open the puzzle.fla file.
You now see the completed tutorial movie in the authoring environment.
2 To see all the contents on the Stage, choose View > Magnification > Show Frame.
The movie contains only one frame, displayed in the main Timeline of the puzzle.fla file. You will use ActionScript to show and hide the various dialog boxes and pattern guides that appear in the puzzle.
3 To resize the Timeline and Stage, drag the bar that separates the Stage from the Timeline up and down. Scroll through the Timeline to see how the layers are organized.
Move this bar to resize the Timeline.
4 To see the dialog boxes and guides on the Stage in the authoring environment, click the red X in the Eye column to the right of a layer’s name. A red X indicates a hidden layer.
You click in the Lock column to lock a layer, which prevents it from being selected. This is useful if you are selecting an item on the Stage that is underneath an item in another layer. The Outline column, indicated by a square above the column, turns on outlines of all the elements in a layer; this can make it easier to see shape edges and can cause Flash to work faster.
5 Select Frame 1 of the Actions layer.
Frame 1 has a lowercase a, which indicates actions are associated with the frame.
To add an ActionScript element to a movie, you must assign it to either a button, a frame, or a movie clip. Frame scripts are indicated by a lowercase a on a frame in the Timeline. To locate button and movie clip scripts, do one of the following:
• Open the Actions panel and select a script from the Jump bar—the pop-up list under the Actions panel title bar.
• Select buttons and movie clips on the Stage with the Actions panel open.
• Use the filtering buttons or the Find text box to search for the script in the Movie Explorer.
6 To view the actions, choose Window > Actions. The Actions panel opens. Expand the panel, if necessary, to see the actions attached to the frame. The Actions panel has two modes, normal and expert. This tutorial explains how to add actions in normal mode.
Within your Flash MX application folder, browse to Tutorials/ActionScript/Finished.
Double-click puzzle.swf to open the completed movie in the stand-alone Flash Player.
2 In the puzzle.swf movie, click the OK button. The puzzle pieces scramble.
3 Click all the Show/Hide buttons. Notice how the different patterns and piece numbers are displayed to guide you in completing the puzzle.
4 Click a puzzle piece and drag it to the solution area. The piece snaps into place.
5 Shift-click a puzzle piece. The piece number appears in the circle under the solution area. You can match the piece number to its location in the piece number guide if you get stuck.
6 Alt-click (Windows) or Option-click (Macintosh) a puzzle piece. The piece rotates clockwise.
7 When you finish viewing the SWF file, you can either close the window or leave it open to serve as a reference.
Analyze the puzzle.fla file
It’s helpful to analyze the completed FLA file to determine how the author put it together and where the ActionScript elements are located.
1 In Flash, choose File > Open. Within your Flash MX application folder, browse to Tutorials/ ActionScript/Finished and open the puzzle.fla file.
You now see the completed tutorial movie in the authoring environment.
2 To see all the contents on the Stage, choose View > Magnification > Show Frame.
The movie contains only one frame, displayed in the main Timeline of the puzzle.fla file. You will use ActionScript to show and hide the various dialog boxes and pattern guides that appear in the puzzle.
3 To resize the Timeline and Stage, drag the bar that separates the Stage from the Timeline up and down. Scroll through the Timeline to see how the layers are organized.
Move this bar to resize the Timeline.
4 To see the dialog boxes and guides on the Stage in the authoring environment, click the red X in the Eye column to the right of a layer’s name. A red X indicates a hidden layer.
You click in the Lock column to lock a layer, which prevents it from being selected. This is useful if you are selecting an item on the Stage that is underneath an item in another layer. The Outline column, indicated by a square above the column, turns on outlines of all the elements in a layer; this can make it easier to see shape edges and can cause Flash to work faster.
5 Select Frame 1 of the Actions layer.
Frame 1 has a lowercase a, which indicates actions are associated with the frame.
To add an ActionScript element to a movie, you must assign it to either a button, a frame, or a movie clip. Frame scripts are indicated by a lowercase a on a frame in the Timeline. To locate button and movie clip scripts, do one of the following:
• Open the Actions panel and select a script from the Jump bar—the pop-up list under the Actions panel title bar.
• Select buttons and movie clips on the Stage with the Actions panel open.
• Use the filtering buttons or the Find text box to search for the script in the Movie Explorer.
6 To view the actions, choose Window > Actions. The Actions panel opens. Expand the panel, if necessary, to see the actions attached to the frame. The Actions panel has two modes, normal and expert. This tutorial explains how to add actions in normal mode.
View actions in the Movie Explorer
1 To locate all of the actions in the movie, use the Movie Explorer. If it’s not open, select Window > Movie Explorer.
In the Movie Explorer, deselect all the filtering buttons except the ActionScript button. In addition to the actions in Frame 1 of the Actions layer, actions are also included in each of the Show/Hide buttons, the buttons in the various dialogs boxes that appear, and each puzzle piece.
2 Select File > Close to close the puzzle.fla movie when you’re finished. Do not save changes to the finished file.
.
.
==============================================
.
Contents
Trademarks
CHAPTER 1 - Introduction to Flash MX Tutorial
CHAPTER 1 - What you should know
CHAPTER 1 - View the completed movie
CHAPTER 1 - Analyze the stiletto.fla file
CHAPTER 1 - Define properties for a new document and create a ...
CHAPTER 1 - Create and mask vector art
CHAPTER 1 - Tween bitmap effects within a movie cl...
CHAPTER 1 - Load dynamic text at runtime
CHAPTER 1 - Add animation and navigation to button...
CHAPTER 1 - Add streaming and event sounds
CHAPTER 1 - Organize your Library panel
CHAPTER 1 - Test download performance and publish ...
CHAPTER 1 - The next steps
.
CHAPTER 2 - Introduction to ActionScript Tutorial
CHAPTER 2 - View a completed movie
CHAPTER 2 - Initialize the movie
CHAPTER 2 - Save and retrieve information
CHAPTER 2 - Display information in a dynamic text ...
CHAPTER 2 - Write an expression
CHAPTER 2 - Control the flow ofthe movie
CHAPTER 2 - Create commands and reuse code
CHAPTER 2 - Use a built-in object
CHAPTER 2 - Test the movie
CHAPTER 2 - The next steps
.
CHAPTER 3 - Introduction to Components Tutorial
CHAPTER 3 - Types of components
CHAPTER 3 - View the completed form
CHAPTER 3 - Create a form
CHAPTER 3 - The next steps
.
==============================================
.
==============================================
.
Contents
Trademarks
CHAPTER 1 - Introduction to Flash MX Tutorial
CHAPTER 1 - What you should know
CHAPTER 1 - View the completed movie
CHAPTER 1 - Analyze the stiletto.fla file
CHAPTER 1 - Define properties for a new document and create a ...
CHAPTER 1 - Create and mask vector art
CHAPTER 1 - Tween bitmap effects within a movie cl...
CHAPTER 1 - Load dynamic text at runtime
CHAPTER 1 - Add animation and navigation to button...
CHAPTER 1 - Add streaming and event sounds
CHAPTER 1 - Organize your Library panel
CHAPTER 1 - Test download performance and publish ...
CHAPTER 1 - The next steps
.
CHAPTER 2 - Introduction to ActionScript Tutorial
CHAPTER 2 - View a completed movie
CHAPTER 2 - Initialize the movie
CHAPTER 2 - Save and retrieve information
CHAPTER 2 - Display information in a dynamic text ...
CHAPTER 2 - Write an expression
CHAPTER 2 - Control the flow ofthe movie
CHAPTER 2 - Create commands and reuse code
CHAPTER 2 - Use a built-in object
CHAPTER 2 - Test the movie
CHAPTER 2 - The next steps
.
CHAPTER 3 - Introduction to Components Tutorial
CHAPTER 3 - Types of components
CHAPTER 3 - View the completed form
CHAPTER 3 - Create a form
CHAPTER 3 - The next steps
.
==============================================
