Adobe Flash CS3 Revealed Chapter 3 - WORKING WITH SYMBOLS AND INTERACTIVITY

1.Create symbols and instances 2.Work with Libraries 3.Create buttons 4.Assign actions to frames and buttons Chapter 3 Lessons Chapter 3

 Create small file sizes  Symbols are graphics that can be re-used without adding file size  Symbols are the original object  Instances are the copied object  Flash stores only symbol information (size, shape, color) thus creating a smaller file size Using Flash Symbols Chapter 3

 Attributes, such as color and shape, can be freely changed for each instance  You can have as many altered instances as you like  Symbols reside in the Library  Dragging a symbol from the Library to the stage creates an instance Using Flash Symbols Chapter 3

 Three types of symbols  Graphics: effective for single, re-usable images  Buttons: for interactivity, such as starting or stopping  Movie Clips: movie within a movie Flash Symbol Types Chapter 3

 Two ways to create a symbol  New Symbol on the Insert menu  Convert to Symbol on the Modify menu  “Convert to Symbol” dialog box allows you to name and specify the type of symbol  Symbol gets placed in the Library  To create an instance, drag a symbol from the Library panel to the stage Creating a Graphic Symbol Chapter 3

Fig. 1: Convert to Symbol Dialog Box Chapter 3

 Select from the Library and double-click, or use the Edit Symbol command  Changes made to symbols are reflected in all their associated instances  Changes made to instances do not affect their symbol Editing a Symbol Chapter 3

 Instances can be altered in many ways  Rotate, skew, resize  Change color, brightness, transparency  Some limitations to editing an instance  Changes must be made to entire instance  Use “Break Apart” for more edibility, but note that the link to the symbol will be broken Working with Instances Chapter 3

Fig. 4: Newly Created Symbol in the Library Panel Preview of g-car symbol in item preview window Icon indicating a graphic symbol Chapter 3

Fig. 5: Creating an Instance Drag instance below original Chapter 3

Fig. 7: Symbol Editing Widow Graphic icon indicates you are in edit symbol mode Name of symbol appears below Timeline layers Chapter 3

Understanding the Library  The Library provides a way to view and organize symbols  Change symbol names and properties  Add or delete symbols Chapter 3

 Title Tab  Names the movie with which the Library is associated  Options Menu  Provides access to additional features of the library  Item Preview window  Displays the selected symbol The Library Chapter 3

 Toggle Sorting Order Icon  Allows you to reorder the lists of folders and symbols within folders  Wide Library View and Narrow Library View icon  Used to expand and collapse the Library window to display more or less of the symbol properties The Library Chapter 3

 Name Text Box  Lists the folder and symbol names  New Symbol Icon  Displays the Create New Symbol dialog box  New Folder Icon  Allows you to create a new folder The Library Chapter 3

 Properties Icon  Displays the Symbol Properties dialog box for the selected symbol  Delete Item Icon  Deletes the selected symbol or folder The Library Chapter 3

Fig. 11: The Library Panel Chapter 3

Fig. 12: The Options Menu Chapter 3

 Button symbols provide interactivity  Any object, including Flash objects, can be turned into a Button symbol  Button symbols have four states that correspond to the use of the mouse and recognize that the user requires feedback  Up  Over  Down  Hit Understanding Buttons Chapter 3

 Up  Represents how the button appears when the mouse pointer is not over it  Over  Represents how the button appears when the mouse pointer is over it The Four Button States Chapter 3

 Down  How the button appears after the user clicks the mouse  Hit  Defines the area of the screen that will respond to the click The Four Button States Chapter 3

Fig. 18: The Four Button States UpOverDown Hit Chapter 3

Fig. 19: The Button Timeline Chapter 3

 Create a button symbol  Edit the button symbol  Return to the main timeline  Preview the button Creating and Previewing Buttons Chapter 3

Fig. 22: Specifying the Hit Area Drag to here Chapter 3

Understanding Actions  In a basic movie, Flash plays frames sequentially  To gain greater control, ActionScripting provides interactivity  Button presses can start/stop a Movie  Jump to a frame or scene Chapter 3

Assigning Actions to a Button  Select the desired button on the stage  Display the Actions panel  Select the Script Assist button to display the Script Assist panel within the ActionScript panel Chapter 3

Assigning Actions to a Button  Select the appropriate category  Select the desired action  Specify the event that triggers the action Chapter 3

Fig. 28: Assigning Actions to Buttons Chapter 3

 Release  With the pointer inside the button Hit area, the user presses and releases the mouse button  Key Press  With the pointer inside the button Hit area, the user presses a predetermined key on the keyboard Button Actions Chapter 3

Button Actions  Roll Over  The user moves the pointer into the button Hit area  Drag Over  The user holds down the mouse button, moves the pointer out of the button Hit area and then back into the Hit  Using Frame Actions  Actions assigned to frames  Executed when the playhead reaches the frame Chapter 3

Fig. 29: Selecting ActionScript 1.0 & 2.0 from the Actions Panel Toolbox pane Layer and frame to which action will be applied Click to toggle between Script Assist off and on Chapter 3

Fig. 32: Assigning an Event to a Button Chapter 3

Fig.33: Specifying the Frame to Go to Change frame number here Chapter 3

Fig. 34: Assigning a Goto Action to a Button Event on Action gotoAndPlay(1) Chapter 3

1.Create symbols and instances 2.Work with Libraries 3.Create buttons 4.Assign actions to frames and buttons Chapter 3 Tasks Chapter 3