- Listening for Events
- Mouse Detection
- The SimpleButton Class
- Invisible Buttons
- Animated Buttons and the Movie Clip Symbol
- Complex Buttons
- Button-tracking Options
- Changing Button Behavior
- Creating Buttons Dynamically
- Keyboard Detection
- The Contextual Menu
- Creating Continuous Actions
- A Summary of Events
This chapter is from the book
This chapter is from the book
This chapter is from the book
Changing Button Behavior
Because the buttons you create are objects of the SimpleButton class and objects of the larger class InteractiveObject, you can control their properties by using dot syntax. Many button properties control the way a button looks (such as its width, height, and rotation) as well as the way the button behaves (such as its button tracking). In Chapter 7, “Controlling and Displaying Graphics,” you will explore the ways to manipulate graphics, including buttons. Here, you will learn to change properties that affect a button’s behavior.
To disable a button
Set the mouseEnabled property to false.
If you name your button instance mybutton_btn, enter the following statement:
mybutton_btn.mouseEnabled = false;
Your button will no longer interact with the mouse pointer and will no longer display its Over or Down keyframes. In addition, mouse events won’t be captured on this button.
To remove an event listener
Use the removeEventListener() method with its two parameters set identical to the ones used in the addEventListener() method.
If you name your button instance mybutton_btn, enter the following statement:
mybutton_btn.removeEventListener(MouseEvent.CLICK, myfunction);
Although your button will still interact with the mouse pointer, the listener will no longer detect a mouse click and call on the function called myfunction.
To disable the hand pointer
Set the useHandCursor property to false 
.
)
If you name your button instance mybutton_btn, enter the following statement:
mybutton_btn.useHandCursor = false;
Changing button focus with the Tab key
The button focus is a way of selecting a button with the Tab key. When a Flash movie plays within a browser, you can press
the Tab key and navigate between buttons, text fields, and movie clips. The currently focused button displays its Over state with a yellow rectangular border 
. Pressing the Enter key (or Return key on the Mac) is equivalent to clicking the focused button. Several properties of the
InteractiveObject class (of which the SimpleButton is a subclass)—focusRect, tabEnabled, and tabIndex—deal with controlling the button focus. The property focusRect determines whether the yellow rectangular border is visible. If focusRect is set to false, a focused button displays its Over state but doesn’t display the yellow rectangular highlight. The property tabEnabled, if set to false, disables a button’s capability to receive focus from the Tab key.
)
The order in which a button, movie clip, or text field receives its focus is determined by its position on the Stage. Objects
focus from left to right and then from top to bottom. So, if you have a row of buttons at the top of your movie and a column
of buttons on the left side below it, the Tab key will focus each of the buttons in the top row first and then focus on each
of the buttons in the column 
. After the last button receives the focus, the tab order begins again from the top row.
)
You can set your own tab order with the property tabIndex. Assign a number to the tabIndex for each button instance, and Flash will organize the tab order using the tabIndex in ascending order. Take control of the tab order to create more helpful forms, allowing the user to use the Tab and Enter keys to fill out multiple text fields and click multiple buttons.
To hide the yellow rectangular highlight over focused buttons
Set the focusRect property to false.
If you name your button instance mybutton_btn, for example, use the statement mybutton_btn.focusRect = false;
To disable focusing with the Tab key
Set the tabEnabled property to false.
If you name your button instance mybutton_btn, for example, use the statement mybutton_btn.tabEnabled = false;
To change the tab order of button focus
- Give each button instance a name in the Properties inspector.
- Select the first frame of the main Timeline, and open the Actions panel.
- In the Script pane, enter your first button’s instance name followed by a dot.
- Type tabIndex after the dot.
- For the value, you must indicate where in the tab order this object should be when the user presses the Tab key. Enter an
equals symbol (=) and then a value
. This button instance will be in the tab order in the specified index.
- Repeat steps 3–5 for each of your button instances. Continue to assign numbers in sequence to the tabIndex property of each button instance
.
- Choose File > Publish Preview > Default to view your movie in a browser.
Click on the Flash movie in the browser to give it focus. When you press the Tab key, Flash follows the tabIndex in ascending order for button focusing
.
)
)
)