Flash CS3 Documentation

Developing Flash Lite 1.x Applications > Creating Interactivity and Navigation > Handling button events

Handling button events

Flash Lite supports the following ActionScript button events: press, release, rollOver, and rollOut. To handle these events, you attach an on(event) handler to a button instance, where event is one of the supported button events listed in the following table:

The following procedure demonstrates how to create a simple application that handles button events. For an example of using buttons to create a menu, see Creating a simple menu using buttons and tab navigation.

To create a button event handler script:

1. Create a new document from the Flash Lite 1.1 Series 60 device template and save it as button_handler.fla.

   For more information on creating documents from the Flash Lite templates, see Using Flash Lite document templates in Getting Started with Flash Lite 1.x.

2. Select Window > Common Libraries > Buttons to open an external library of prebuilt button symbols.
3. In the Library panel, double-click the Circle Buttons folder to open it.
4. Drag an instance of the Menu button symbol to the Stage.
5. Select the button and open the Actions panel (Window > Actions).
6. Type the following code in the Actions panel:

   on(press) {
       trace("You pressed Button 1");
   }
   on(release) {
       trace("You released Button 1");
   }
   on(rollOver) {
       trace("Button 1 has focus");
   }
   on(rollOut) {
       trace("Button 1 lost focus");
   }
   

7. Drag another instance of the same button to the Stage and position it directly below the first button.
8. With the second button selected on the Stage, open the Actions panel and enter the following code:

   on(press) {
       trace("You pressed Button 2");
   }
   on(release) {
       trace("You released Button 2");
   }
   on(rollOver) {
       trace("Button 2 has focus");
   }
   on(rollOut) {
       trace("Button 2 lost focus");
   }
   

9. In the Timeline, select Frame 1 on the ActionScript layer.
10. Type the following code in the Actions panel:

    _focusRect = false;
    

    This disables the yellow focus rectangle that Flash Lite draws around the button with focus. In this case, the default focus rectangle is unnecessary because the button's contains an Over state that is displayed when it has focus.

11. Test the application using the Adobe Device Central emulator (Control > Test Movie).

    The emulator displays messages as you press the Up and Down Arrow keys on the keypad.

    
    
    

Flash CS3