Introduction to ActionScript 3.0

1
Chapter 9

• Introduction to ActionScript 3.0

2
Chapter 9 Lessons

1. Understand ActionScript 3.0
2. Work with instances of movie clip symbols
3. Use code snippets
4. 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 objects 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 paneprovides the categories of
  actions that can be selected to build
  ActionScript code.
• Script navigator paneprovides a list of frames
  that contain scripts used in the movie.
• Script paneused 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