User Guide

132 Chapter 6: Components Dictionary
Button parameters
You can set the following authoring parameters for each Button component instance in the
Property inspector or in the Component inspector:
label sets the value of the text on the button; the default value is Button.
icon adds a custom icon to the button. The value is the linkage identifier of a movie clip or
graphic symbol in the library; there is no default value.
toggle turns the button into a toggle switch. If true, the button remains in the down state when
clicked and returns to the up state when clicked again. If
false, the button behaves like a normal
push button; the default value is
false.
selected if the toggle parameter is true, this parameter specifies whether the button is pressed
(
true) or released (false). The default value is false.
labelPlacement orients the label text on the button in relation to the icon. This parameter can be
one of four values:
left, right, top, or bottom; the default value is right. For more
information, see
Button.labelPlacement.
You can write ActionScript to control these and additional options for the Button component
using its properties, methods, and events. For more information, see “Button class” on page 139.
Creating an application with the Button component
The following procedure explains how to add a Button component to an application while
authoring. In this example, the button is a Help button with a custom icon that opens a Help
system when a user clicks it.
To create an application with the Button component:
1. Drag a Button component from the Components panel to the Stage.
2. In the Property inspector, enter the instance name helpBtn.
3. In the Property inspector, do the following:
■ Enter Help for the label parameter.
■ Enter HelpIcon for the icon parameter.
To use an icon, there must be a movie clip or graphic symbol in the library with a linkage
identifier to use as the icon parameter. In this example, the linkage identifier is HelpIcon.
■ Set the toggle property to true.
4. Select Frame 1 in the Timeline, open the Actions panel, and enter the following code:
function click(evt){
clippyHelper.enabled = evt.target.selected;
}
helpBtn.addEventListener("click", this);
The last line of code adds a click event handler to the helpBtn instance. The handler enables
and disables the
clippyHelper instance, which could be a Help panel of some sort.