Flash Notes: Properties, Button Event Listeners
I’m finally getting around to learning ActionScript 3 and what better way to learn than forcing myself to upgrade an ActionScript 2 project and working on some other simple ones. Over several posts I’ll document what I’ve discovered, mostly as a personal reference so I can refer to them later.
Properties
Several properties in AS 2 have changed. The general rule is any that had an underscore, now doesn’t have one.
movieClip._x movieClip._y movieClip._height; movieClip._width; movieClip._alpha; movieClip._visible; movieClip._xscale; movieClip._yscale; _xmouse; _ymouse;
are now all:
movieClip.x movieClip.y movieClip.height; movieClip.width; movieClip.alpha; movieClip.visible; movieClip.scaleX; movieClip.scaleY; mouseX; mouseY;
Some properties that had a range of 1 to 100 now range from 0 to 1, most notably alpha and scale.
Here’s an excellent cheat sheet which covers changes from AS2 to AS3.
Mouse Events and Event Listeners
The next big change in AS3 are event listeners. A lot of situations handled in a variety of confusing ways are now handled in this manner. Some of these are loading items (goodbye loadMovie) and mouse interactivity. The most obvious place to introduce the event listener concept is with a button.
First, forget all the AS2 handlers (onRelease, onRollOver, etc). In AS3, you’ll add “event listeners” to button:
myButton.addEventListener(MouseEvent.MOUSE_UP, myButtonUp);
“myButton” is the instance name of the movie clip I want to target. “MouseEvent.MOUSE_UP” is the specific event the listener is listening for, and “myButtonUp” is the function that’s called when that event occurs.
Now you just define the “myButtonUp” function that will be triggered. Note that the event type is listed (MouseEvent) and “:void” indicating nothing is returned by this function.
function MyButtonUp (event:MouseEvent):void{ trace("Hello World"); }
There are similar mouse events for other common button behaviors:
myButton.addEventListener(MouseEvent.ROLL_OVER, myButtonOver); function myButtonOver (event:MouseEvent):void{ trace("Rolled over the button"); } myButton.addEventListener(MouseEvent.ROLL_OUT, myButtonOut); function myButtonOut (event:MouseEvent):void{ trace("Rolled off of the button"); }
So here’s an example. There are four listeners and the button behaves as a button should. Oh boy.
Note #1: To get the hand cursor and up, over, and down states, I put the movie clip into “button mode” (myButton.buttonMode = true). Then the button can be set up with up, over, and down art using keyframes within that movie clip as in the image below:

Note #2: When designing more complex buttons, I noticed if there are other elements within the button movie clip, the listeners can register false. There are additional properties to limit the event behavior of movie clips within movie clips (”children”). So in the above example, I set the property “mouseChildren” of myButton to false (mybutton.mouseChildren = false). Read more about this subject at Partly Human.
Anyhow, before this simple example gets too complicated, here’s a list of some common events:
MouseEvent.CLICK –> Mouse click
MouseEvent.DOUBLE_CLICK –> Mouse Double Click
MouseEvent.MOUSE_MOVE –> Mouse move
MouseEvent.MOUSE_DOWN –> Mouse button pressed
MouseEvent.MOUSE_UP –> Mouse button released
MouseEvent.MOUSE_OVER –> Cursor moves over something
MouseEvent.MOUSE_OUT –> Cursor moves off of something
MouseEvent.MOUSE_WHEEL –> Mouse wheel moves
KeyboardEvent.KEY_DOWN –> Key pressed
KeyboardEvent.KEY_UP –> Key released
Event.ENTER_FRAME –> Equivalent for “onEnterFrame”
TimerEvent.TIMER –> Happens every timer interval
TimerEvent.TIMER_COMPLETE –> Happens when timer object finishes
The event listener model is the basis for many situations in ActionScript 3.0: keyboard events, preloaders, and image loading. So although this concept was at first annoying, it’s become increasingly handy.
More to come.
Front Page