Button Events

Table 14.1 shows events associated with buttons, but it is important to note that both the Button and the MovieClip classes of objects support events in frames, as well as in the object actions.

Table 14.1. Button Events

Event Handler Object Action	Event Handler Frame Method	Action Description
on (press)	onPress	The event triggered when a user presses a button
on (release)	onRelease	The event triggered when a user releases a button after pressing it
on (releaseOutside)	onReleaseOutside	The event triggered when a user releases the mouse button outside the hit area of a button that has received an onPress event
on (rollOver)	onRollOver	The event triggered when a user's mouse cursor moves over a button without the mouse button being pressed
on (rollOut)	onRollOut	The event triggered when a user moves the mouse cursor outside a button's hit area without the mouse button being suppressed
on (dragOver)	onDragOver	The event triggered when a user moves the mouse cursor over a button's hit area after the button has received an onDragOut event
on (dragOut)	onDragOut	The event triggered when the mouse cursor is moved outside the button's hit area while the mouse button is depressed
on (keyPress"...")	onKeyDown, OnKeyUp	The event triggered when a user presses or releases a key on the keyboard that has been specified in the event
N/A	onSetFocus	The event triggered when a button receives focus from a keyboard interaction (for example, if a user uses the Tab key to gain focus on the button)
N/A	onKillFocus	The event triggered when a button loses keyboard focus

Now that you've seen all the available events for buttons, let's use some of them in the following example:

1.	Create a new Flash document.
2.	You learned how to create a button in earlier chapters, so we will use one from the common libraries. Choose Window>Common Libraries>Buttons. Choose your favorite button and drag it out to the stage.
3.	Give the button on the stage an instance name of myButton_btn.
4.	Create another layer and name this layer actions.
5.	In the actions layer, place these actions: //the event for rollover myButton_btn.onRollOver = function(){ trace("rollOver occurred"); } //the event for press myButton_btn.onPress = function(){ trace("press occurred"); } //the event for release myButton_btn.onRelease = function(){ trace("release occurred"); } //the event for release outside myButton_btn.onReleaseOutside = function(){ trace("release outside occurred"); } //the event for rollout myButton_btn.onRollOut = function(){ trace("rollOut occurred"); } //the event for dragOver myButton_btn.onDragOver = function(){ trace("dragOver occurred"); } //the event for dragOut myButton_btn.onDragOut = function(){ trace("dragOut occurred"); }

The preceding code creates several event callbacks to use with the button we created on the stage.

Test the movie, and do everything you can to the button. You will notice a series of messages in the Output panel depending on what events you trigger with the button. Figure 14.3 shows some of the messages sent to the Output panel.

Figure 14.3. Use callbacks for button events.

A button is just one of the objects that can handle events on an independent timeline frame or within the object itself. Another object that can do the same is the movie clip object.