Home >> Production >> Flash and ActionScript >> ActionScript Part I

ActionScript Part I: Basic Actions

  • frame based actions vs. button actions
  • understanding frame based actions
  • working with buttons: on mouse events

Introduction

Your Flash movie can either run straight through linearly without any interaction from the user, much like watching an uninterrupted cartoon, or your movie can incorporate some basic interactivity, letting the user activate buttons which take them to different parts of your site. In order to mix motion and animation with user interactivity, you must use basic actions that tell the movie to stop playing in order to wait for some interaction (such as pressing a button) from the user. This section will briefly cover some of the basic actions involved in ActionScript, Flash's scripting language.

Frame-Based Actions vs. Button Actions

There are two ways to put actions into your timeline. One way involves making a keyframe and then double-clicking to add an action (which is represented on the timeline by the letter a) See keyframes 15 and 30 in the example below.

Exercise: download basicactions1.fla and save it in a folder on your zip disk outside of your last name folder. Call the folder Samples. This file is exactly like the one you see here, except the actions have been removed. Open this file in Flash and add actions so that the movie stops on frame 15 and then proceeds to frame 16 when the Contine button is pressed. It should stop again at the end (frame 30) and when the Begin Again button is pressed, it should start over and play from the beginning.


Frame Based Actions

In this example, the movie will start at frame 1 with a motion tween, and then when it arrives on frame 15 it will perform an action. This action might tell the movie to stop playing. Or it might tell the movie to go to and stop at another frame, or it might tell the movie to go to and play from the beginning again. Actions that appear in the timeline like this are known as frame based actions. These actions will be executed when the timeline reaches the frame with the action.

In our example from above, you want to add two frame based stop actions-- one on frame 15, and the other on frame 30. This will stop the animation and let users control the timeline with the buttons.

Button Actions

Button actions, on the other hand, are actions that are embedded into a button.

The timeline above has a frame-based stop action on frame 15, so the movie will stop playing when it reaches frame 15. But there is a button symbol that appears on the stage in frame 15 (while the movie is stopped). The button has actions in it that say: when this button is released, go to and play frame 16. The action script in the button looks like this:

on (release) {
gotoAndPlay (16);
}

But unlike HTML, you do not have to worry about syntax. Flash has an internal script builder that helps you put together action events.

Working with buttons: On Mouse Event

STEP ONE:
To get the button to play frame 16 when pressed, right click on the button symbol on the stage:

This pops open the Actions Editor.

STEP TWO:
Under the Basic Actions tab (on the left) first double click On Mouse Event. The choices on the bottom reflect the action you have chosen. When working with buttons, you should use Release instead of Press. This lets the user drag their mouse away if they decide not to click the button. There are a lot of options here. You might have the timeline play another part of the movie on Rollover, and then another part on Roll Out. You might have someone press a certain letter on the keyboard to make an action happen.

STEP THREE:
After double clicking Mouse Event and checking Release at the bottom, the next step is to give instructions on what to do once the button is pressed. In our example, on release of the button we want to go to and play frame 16.

Double click Go To

The options on the bottom change. You can have the movie go to and play a frame number, a frame label, an expression (advanced actionscript), or the next or previous frame. Most of the time, you will probably use Labels. These are more flexible and easier to work with then using frame numbers, but in this example we are using numbers. In the Frame field at the bottom, type 16 and make sure Go to and Play is checked.

Now, when the Continue button is pressed, the timeline will go to and play the next frame, frame 16.

STEP FOUR:
Finally, you want the movie to stop at the end of the timeline, giving the user the option of clicking the Begin Again button which will send it back to the beginning of the movie. To do this you will follow the same steps as before. Right click on the button symbol "Begin Again" in frame 30 to access the actions window.

Double-Click On Mouse Event and make sure Release is checked at the bottom

Double-Click Go To and at the bottom specify Frame Number 1

 

That's it! Test your movie by hitting Control-Enter to see if it works. If not, download this final version of basicactions.fla and examine the actions and frames to see what you did wrong. Did you forget the frame-based stop actions?

Go on to Basic Actions II: Get URL and button states