1. © 2010 Delmar, Cengage Learning Chapter 9: Using ActionScript

2. © 2010 Delmar Cengage Learning Chapter 9 Lessons 1.Work with the Actions Panel 2.Work with Targets and Movie Clip Symbols 3.Create Interactive Movie Clip Symbols 4.Define Variables

3. © 2010 Delmar Cengage Learning Using ActionScript You can –Create ActionScript that changes appearance of objects in movie –Create a form that captures user data and displays it elsewhere in site –Add actions to a frame, any object, or a movie clip symbol

4. © 2010 Delmar Cengage Learning Using ActionScript ActionScript –Type of programming language –Exact syntax is essential Actions panel helps ensure that ActionScript follows required syntax and runs efficiently

5. © 2010 Delmar Cengage Learning Working with the Actions Panel Actions panel –Adds complex interaction, playback control, and data manipulation –Three panes Actions Toolbox pane Script Navigator pane Script pane

6. © 2010 Delmar Cengage Learning Fig. 1: Actions Panel Panes Check Syntax button Auto format button Script pane Script Navigator pane Actions Toolbox pane

7. © 2010 Delmar Cengage Learning Script Assist Good for basic actions such as goto Useful if you have limited knowledge of ActionScript Code cannot be edited directly in Script pane

8. © 2010 Delmar Cengage Learning Script Assist With Script Assist turned off –You build ActionScript code by selecting actions listed in Toolbox –Code generates as you make selections –You can type directly into Script pane to create and edit code

9. © 2010 Delmar Cengage Learning Configuring the Actions Panel Left window of Actions panel –Displays Actions Toolbox pane –Displays Script Navigator pane Right window of Actions panel –Displays Script pane –Should be displayed at all times

10. © 2010 Delmar Cengage Learning Fig. 2: Actions Panel with Actions Toolbox Pane Collapsed Expand/Collapse arrow Code applied to frame 1 of the action layer

11. © 2010 Delmar Cengage Learning Writing ActionScript Code Syntax rules –Use exact case for action names –Semicolon (;) terminates ActionScript statement –Functions or parameters for an action are enclosed in parentheses –Text strings appear between quotation marks

12. © 2010 Delmar Cengage Learning Writing ActionScript Code Syntax rules –To group actions, enclose them in curly brackets - {} Code hints –Give syntax or possible parameters for an action in a pop-up window

13. © 2010 Delmar Cengage Learning Fig. 3: Example of ActionScript Code Parameters enclosed in parentheses Actions grouped within curly brackets Text within quotation marks Semicolon terminates ActionScript statement

14. © 2010 Delmar Cengage Learning Referencing the Timeline in Actions Referencing a specific frame –Allows you to break movies out of sequential movement of timeline Frame number or frame label can be used

15. © 2010 Delmar Cengage Learning Referencing the Timeline in Actions Frame label –Text name for a keyframe Advantage of frame label –Adding or deleting frames will not disrupt navigation or frame references

16. © 2010 Delmar Cengage Learning Fig. 5: Creating a Frame Label Frame label in frame 10 Type frame label here

17. © 2010 Delmar Cengage Learning Getting Help on ActionScript Help panel useful when you –Are not sure what an action does –Need guidance on which parameters to use To display Help panel –Highlight action in Actions Tools panel –Click Help icon

18. © 2010 Delmar Cengage Learning Adding Comments to a Frame Adding a comment to a frame –Preface text with two slashes: // You cannot reference comments in actions

19. © 2010 Delmar Cengage Learning Working with Movie Clips Helps manage your document Lets you reuse content and reduce file size Actions can be used Actions associated with movie clips can be set up to run: –when a user performs an action –automatically when movie plays –when a condition is met

20. © 2010 Delmar Cengage Learning Referencing Movie Clip Symbols as ActionScript Targets To control movie clip symbols and their timelines with ActionScript –Target movie clips, or –Refer to them by path and name Property inspector –Used to create instance name for movie clip to which you want to refer

21. © 2010 Delmar Cengage Learning Referencing Movie Clip Symbols as ActionScript Targets Movie clip symbols –Can be targeted at any level –Specified either by typing path and name directly using dot syntax, or –By clicking the Insert a Target Path icon The “with” action –Lets you target a movie clip

22. © 2010 Delmar Cengage Learning Fig. 9: Insert Target Path Dialog Box

23. © 2010 Delmar Cengage Learning Referencing Movie Clip Symbols as ActionScript Targets A dot (.) –Identifies hierarchical nature of path Dot syntax –Can be used in ActionScript statements to set actions and variables –Special terms: root, _parent, and this

24. © 2010 Delmar Cengage Learning Fig. 10: ActionScript Statement Using Dot Syntax Refers to current Timeline Parent movie clip Nested movie clip

25. © 2010 Delmar Cengage Learning Fig. 13: ActionScript to Change the Color of Shirt on Button Release with―allows movie clip to be targeted this―indicates current timeline myShirt―is the movie that is being targeted

26. © 2010 Delmar Cengage Learning Fig. 16: Referencing a Frame Label in the Nested Movie Clip Symbol “stars” typed in text box as frame label Frame labelNested movie clip

27. © 2010 Delmar Cengage Learning Understanding Interactive Movie Clips startDrag and stopDrag actions –Make movie clip draggable while movie is playing _droptarget –Extends draggable movie clip feature ActionScript statements –Can change properties of movie clip symbols as movie is playing

28. © 2010 Delmar Cengage Learning Fig. 19: Draggable Movie Clips in a Flash Game Each checker is a movie clip symbol, which you can drag to a square

29. © 2010 Delmar Cengage Learning Creating Conditional Actions if action –Can test whether certain conditions have been met When creating conditions in ActionScript –Use two equals signs (==) Single equals sign (=) –Sets variable to a specific value

30. © 2010 Delmar Cengage Learning Fig. 20: Example of Conditional ActionScript Statement

31. © 2010 Delmar Cengage Learning Fig. 23: ActionScript to Create Conditional Statement No period Make sure to include two equal signs when typing the new action Parentheses are used to enclose the conditional part of the conditional statement

32. © 2010 Delmar Cengage Learning Fig. 24: Actions to Execute if Conditional Statement Is True Note: Your indentation may vary; be sure to start and end with a curly bracket; do not include spaces Make sure to use exact case when typing the new action

33. © 2010 Delmar Cengage Learning Understanding Variables Variable –Container that holds information –Dynamic String variable –Sequence of characters –Example: myExam = "Pop Quiz" Number variable –Example: myScore = 93

34. © 2010 Delmar Cengage Learning Using Text Fields to Collect User Information Input text field –Stores information entered by user as a variable Dynamic text field –Displays information derived from variables

35. © 2010 Delmar Cengage Learning Understanding Expressions Expressions –Formulas for manipulating or evaluating information in variables Flash lets you enter logical expressions that perform true/false comparisons

36. © 2010 Delmar Cengage Learning Fig. 26: Using the Property Panel to Create an Input Text Field Specify Input Text here Type the variable name here

37. © 2010 Delmar Cengage Learning Fig. 27: Example of an Expression Used for a Calculation Expression to subtract one number from another

38. © 2010 Delmar Cengage Learning Fig. 31: Creating the Dynamic Text Field Type variable name here

39. © 2010 Delmar Cengage Learning Fig. 34: The Working Formula

40. © 2010 Delmar Cengage Learning Fig. 36: ActionScript Using the Number Function

41. © 2010 Delmar Cengage Learning Chapter 9 Summary 1.Work with the Actions Panel 2.Work with Targets and Movie Clip Symbols 3.Create Interactive Movie Clip Symbols 4.Define Variables