Chapter 9

1. Chapter 9 Introduction to ActionScript 3.0

2. Chapter 9 Lessons • Understand ActionScript 3.0 • Work with instances of movie clip symbols • Use code snippets • Work with variables

3. Understand ActionScript 3.0 • The emphasis in AS3 shifts to the objects, both on and off the Stage. • You can write code directly in the Actions panel that defines the button and specifies the event (mouse click) that triggers the action (goto) or simply plays the motion tween without moving the playhead.

4. Understand ActionScript 3.0 • When you start a new Flash movie, you must choose AS2 or AS3. Specifying AS3 means that when you are writing code in the Actions panel, you must adhere to the AS3 rules. • However, you can still use the draw tool features that you have already learned.

5. Understand ActionScript 3.0 • Most Flash movies are a combination of using the drawing tools and ActionScript code. • You can only develop using one ActionScript code. • In AS3, an object is an instance, similar to the instances you created from movie clip graphics and button symbols.

6. Understand ActionScript 3.0 • With AS3, instances are defined by classes instead of symbols. • Classes have certain attributes (properties) and functionality (methods) that are passed on to its objects. • The properties describe the objects. • The methods describe what the objects can do.

7. Understand ActionScript 3.0 Summary of specific AS3 concepts and terms

8. Understand ActionScript 3.0 • The Flash program has many predefined classes. • If a class is not predefined in Flash, you can import it. • Flash files have a display list and Flash uses it to manage every object on the screen when the movie is published.

9. Understand ActionScript 3.0 • In order for an object to be on the display list, it must be a part of the DisplayObjects class. • Objects that can be a part of this class include movie clips, buttons, text, shapes, bitmaps, and videos. • Objects you create in AS3 must be added to the display list with the addchild() method.

10. Understand ActionScript 3.0 • A variable is a container that holds data and the data can be either numeric or text. • You can assign each variable a Data Type, which indicates class used to populate the variable. • Data Types include: Number, String (text), MovieClip, and Shape.

11. Understand ActionScript 3.0 • An important use of variables is to hold instances of objects that can be referred to throughout the AS3 code. • The process for working with AS3 is to plan how you will be developing objects, how you will be using the Timeline, and how to construct the user interactivity.

12. Understand ActionScript 3.0 With just four lines of code you can create a circle and specify a fill color, size, and Stage location.

13. Understand ActionScript 3.0 • Many, but not all classes are built into a Flash document. • You can keep the Flash file size smaller by including only commonly used classes, such as Shape.

14. Understand ActionScript 3.0 • Tweens involve a change in an object’s size, transparency, or position, and these changes could also involve easing. • You must import the Tween class and the Easing class. • The code for these two imports is: • import fl.transitions.Tween; • import fl.transitions.easing

15. Understand ActionScript 3.0 • After adding a motion tween to an object, a button can be added to provide interactivity. • A common type of interactivity is to have the user click a button, which causes some action.

16. Understand ActionScript 3.0 • With AS3, you do not assign code to a button or any object on the Stage, instead, you reference the object within the code Instance name for object on the Stage

17. Understand ActionScript 3.0 • AS3 is a strict code environment which means you must adhere to specific syntax rules including spelling, punctuation, capitalization, and use of special characters. • If you need help, you can display code hints which give the syntax or possible parameters for an action you are entering.

18. Understand ActionScript 3.0 • To see a code hint, type the action statement, and then type an opening parenthesis. • To dismiss the code hint, type the action statement, and then type a closing parenthesis or press [Esc]. • To disable code hints, click Edit on the Menu bar, click Preferences, and then click to deselect the Code hints check box in the ActionScript category.

19. Understand ActionScript 3.0 • The Check syntax button checks for any errors in the syntax of the coding and displays a message in the Compiler Errors panel if any errors are found. • The Auto format button formats the code in accordance with ActionScript formatting conventions. This may add spaces, lines, and indents to make code more readable.

20. Understand ActionScript 3.0 • The Actions panel has three panes. • Actions toolbox pane—provides the categories of actions that can be selected to build ActionScript code. • Script navigator pane—provides a list of frames that contain scripts used in the movie. • Script pane—used to type in the code and a toolbar for editing code.

21. Understand ActionScript 3.0

22. Understand ActionScript 3.0 • The left window in the Actions panel displays the Actions toolbox pane and the Script navigator pane. • The right window in the Actions panel displays the Script pane where the ActionScript code is displayed. • You can resize the windows by dragging the border between the two panes up or down.

23. Work with Instances of Movie Clip Symbols • Using movie clips in a Flash document helps you to manage your document by breaking complex tasks into smaller components. • It allows you to reuse content and reduce file size. • You can also use actions with movie clips giving you more control over the objects.

24. Work with Instances of Movie Clip Symbols • You can set actions you associate with movie clips to: • Run automatically • Run when a user performs an action • Run when a condition is met • The Export for ActionScript feature allows you to export a movie clip.

25. Work with Instances of Movie Clip Symbols Symbol Properties dialog box is used to make Export for ActionScript active Class name from dialog box is displayed in Linkage area of Library panel Instance on the screen when movie is published Code to add Purple shirt to display list Code to create new instance of Purple shirt based on PurpleShirtMC The process for exporting a movie clip for use in AS3

26. Use Code Snippets • AS3 allows you to enter predefined blocks of AS3 code called code snippets, which provide a quick way to insert AS3 code into the Script pane

27. Use Code Snippets • When you use a code snippet, the process includes: • Creating a button symbol and giving it an instance name • Selecting the button instance on the Stage • Opening the Code Snippets panel and clicking the desired snippet to enter that code in the Script pane • Editing the code as needed, such as changing the function name and editing the actions you want executed

28. Use Code Snippets • You should think of code snippets as templates that allow you to make changes to customize the code, including changes in function names, frame numbers, or properties such as ease values. • As you write code, it becomes useful to provide comments to help clarify what is happening in a particular section of code.

29. Use Code Snippets

30. Use Code Snippets • You can insert comments by using the Apply block comment button or Apply line comment button on the Actions menu bar. • You can also add a comment to your ActionScript code by typing a slash and an asterisk (/*) at the beginning and an asterisk and a slash (*/) at the end of one or more lines of text.

31. Use Code Snippets • Any code between this set of symbols is treated as a comment and it is ignored when the ActionScript code runs. • Alternately, if your comment is only a single line, you can place two slashes (//) at the beginning of the line, and that line will be ignored when the ActionScript runs. • Comments appear as gray text.

32. Use Code Snippets When you make a movie clip draggable, you allow the user to move the movie clip to another location on the screen Draggable movie clips in a Flash game

33. Use Code Snippets • AS3 code can also change the properties of movie clip symbols as a movie is playing. • You can control such properties as position, rotation, color, size, and whether the movie clip is visible or hidden. • Actions that change movie clip properties are often used in combination with actions that test for user input or interactions.

34. Work with Variables • A variable is a container that holds information. • Variables are dynamic; that is, the information they contain changes depending on an action a user takes or another aspect of how the movie plays. • You create variables in ActionScript with the var keyword.

35. Work with Variables • You can create a string variable, which is a sequence of characters including letters, numbers, and punctuation, by placing quotation marks around the string. • You can create a number variable by just writing the number. • A powerful use of variables allows you to collect and work with information from users by creating input text fields.

36. Work with Variables

37. Work with Variables • An input text field takes information entered by a user and stores it as a variable. • A dynamic text field displays information derived from variables. • A dynamic text field can be used together with an input text box.

38. Work with Variables • When you include input text fields in your Flash movie you need to embed the font so that it is available to the users no matter what fonts they have on their computer. • When you embed the font, it ensures the text maintains the appearance you desire.

39. Work with Variables • Expressions are formulas for manipulating or evaluating the information in variables. • Flash lets you enter logical expressions that perform true/false comparisons on numbers and strings, with which you can create conditional statements and branching.

40. Work with Variables