Home > Articles > Graphics & Web Design > Dreamweaver & Flash

  • Print
  • + Share This
  • 💬 Discuss

Object and Frame Actions

Here's the basic structure of an action:

whenSomethingHappens(input variables)
{
		do stuff
}

We'll be elaborating on this basic structure significantly.

There are two kinds of actions: frame actions and object actions.

Object Actions—Movie Clips

Object actions are actions, or chunks of ActionScript code, that are attached to an object. Most of the time, an object is a symbol that's either a button or a movie clip. Graphic symbols can't have actions, nor can shapes you draw on the stage that aren't symbols (unless you create an empty movie and then draw in it. But more on that later). You can create your own objects, as we just saw.

An object action is associated with an instance of a symbol, not with the symbol itself. Here's an example (see Figure 1–1).

Figure 1-1Figure 1–1 Dragging one of the fish


  1. Load the movie chapter1/fish_drag.fla.

  2. Control ˆ Test Movie.

  3. Notice by positioning the cursor over each of the fish and dragging your mouse, you can move the fish on the left, but not the one on the right. In fact, no matter where you click, you move the fish on the left and the right one stays put.

Both fish are instances of the same movie clip symbol, but only one of them has an action attached to it. Let's see what that action looks like. Exit from the movie test and return to the Flash editor (the main program). There are many ways to configure this new user interface (UI) that Macromedia has implemented for Flash MX. To keep life easy, go to Window ˆ Panel Sets ˆ Developer and choose your screen resolution.

The Actions panel appears, as shown in Figure 1–2.

Figure 1-2Figure 1–2 The Actions panel (Expert Mode)


I recommend turning on line numbers. That option is launched by clicking the View Options menu, located under the little pushpin on the right side of the Actions panel, as in Figure 1–3.

Figure 1-3Figure 1–3 View Options menu


You can also see I've chosen Expert Mode (more on that later). The code that appears should be:

onClipEvent(mouseDown)
{
		startDrag(this);
}

onClipEvent(mouseUp)
{
		stopDrag();
}

These two functions never leave this object instance, no matter where this instance appears in the movie. The actions will happen to this object from the first frame of the movie all the way to the last frame of the movie. Object actions don't care what frame the movie is currently on (as long as the object actually exists in the movie at that frame).

The two functions you see are onClipEvents. onClipEvent is known as an event handler. An event is something that happens: for instance, a movie finishes loading, the user presses a mouse button, or the user hits the space bar. An event handler is a piece of Flash that is constantly looking for these events and lets ActionScript know when one of them occurs.

Since the fish symbol is a movie clip, each instance of that symbol gets an event handler called onClipEvent that will constantly look at the mouse and keyboard to see if the user is doing anything. If the user does do something, like pressing down the mouse button, say, the event handler looks at the ActionScript to see if that event exists anywhere in the code.

In this code, we're looking for two events, mouseDown and mouseUp. These refer to what the mouse button is doing. Is the mouse button currently being pressed down or was it just released?

If the mouse button was pressed, then onClip-Event(mouseDown) is called, and everything inside the first set of curly braces is executed. As it happens, there's only one thing to do:

startDrag(this);

startDrag is what's called a method. Briefly put, a method does something (as opposed to a property, which just holds a specific bit of information). We'll examine this method briefly now and in more detail later (it's darn useful).

startDrag causes the object in question to mirror the motion of the mouse cursor. Notice that we didn't use startDrag(), but rather used startDrag(this). The startDrag method requires a target—that is, it needs to know what it should start dragging. The easiest way to reference the current object is just to call it this. You'll see this being used again in this book.

The other way to refer to the object is

startDrag(_root.drag_fish)

where drag_fish is the name of the instance of the fish symbol. The _root part means "start looking from the top of the movie hierarchy." If this is confusing, don't worry. It is covered later in this chapter in the section "Dot Syntax."

Object actions that are on a movie clip have to be inside of an onClipEvent. The events are:

  • load
  • unload
  • enterFrame
  • mouseMove
  • mouseDown
  • mouseUp
  • keyDown
  • keyUp
  • data

Object Actions—Buttons

The only real difference between actions that are attached to buttons instead of movie clips is that the event handler for buttons is on instead of onClipEvent. Otherwise, they're pretty much the same. The events for on are:

  • press
  • release
  • releaseOutside
  • rollOver
  • rollOut
  • dragOver
  • dragOut
  • keyPress

Here's an example that I doubt will find its way into one of your movies, but illustrates the on event handler nicely.

  1. Load the movie chapter1/face_button.fla.

  2. Control ˆ Test Movie.

  3. Notice when you press down on the mouse button, the fish appears.

  4. Return to the Flash editor.

  5. Click on the button symbol.

  6. Open the Actions panel to see the actions.

Frame Actions

Frame actions are like object actions, except that the actions are associated with a certain spot in the timeline instead of an object. If a frame has some actions associated with it, those actions are carried when the playhead enters that frame.

A simple example would be stopping a movie at the last frame so that it doesn't loop, which Flash movies do by default.

  1. Open chapter1/fish_cruise.fla.

  2. Notice the layer Actions. Creating this layer isn't necessary to place actions on, but I find it useful.

  3. Double-click on the small a on the timeline on frame 60 on the actions layer.

  4. Open the Actions panel.

The Frame Actions panel looks like as shown in Figure 1–4 (notice it looks almost exactly like the Object Actions panel), with this code:

Figure 1-4Figure 1–4 The timeline and the Frame Actions panel


stop();

As you might predict, this command stops the movie in its tracks. It stays stopped unless some other action starts it up again.

Flash will place a frame action only on a keyframe. If you try to place a frame action on a regular frame, Flash will look backwards in the timeline until it finds a keyframe and place the frame action on that keyframe, not on the regular frame you clicked on. I recommend placing all of your frame actions on a separate layer—it makes organization much easier.

  • + Share This
  • 🔖 Save To Your Account

Discussions

comments powered by Disqus