Использование компонента Button

Компонент Button — это прямоугольная кнопка с изменяемым размером, которую пользователь может нажать с помощью мыши или клавиши пробела, чтобы инициировать выполнение действия в приложении. К экземпляру Button можно добавить пользовательский значок. Также можно изменить поведение компонента Button с нажатия на переключение. После щелчка кнопка-переключатель остается в нажатом положении и возвращается в исходное положение при повторном щелчке.

Компонент Button является основным элементом многих форм и веб-приложений. Кнопки можно использовать везде, где пользователь должен инициировать событие. Например, в большинстве форм используется кнопка «Отправить». А в презентацию можно добавить кнопки «Предыдущий» и «Следующий».

Взаимодействие пользователей с компонентом Button

Кнопку в приложении можно включить или отключить. В отключенном состоянии кнопка не реагирует на мышь или клавиатуру. Включенная кнопка получает фокус при щелчке или переходе с помощью клавиши Tab. Когда экземпляр Button получает фокус, им можно управлять с помощью следующих клавиш.

Клавиша

Описание

Shift+Tab

Переводит фокус на предыдущий объект.

Пробел

Нажимает или отпускает кнопку и запускает событие click .

Табуляция

Переводит фокус на следующий объект.

Enter/Return

Переводит фокус на следующий объект, если кнопка задана в качестве кнопки по умолчанию для FocusManager.

Дополнительные сведения об управлении фокусом см. в описании интерфейса IFocusManager и класса FocusManager в справочнике ActionScript® 3.0 для Adobe® Flash® Professional CS5 и разделе « Работа с FocusManager ».

Интерактивный просмотр каждого элемента Button отражает изменения, которые были внесены в параметры в Инспекторе свойств или Инспекторе компонентов во время разработки.

Примечание. Если значок больше кнопки, то он выходит за ее пределы.

Чтобы назначить кнопку в качестве нажимной кнопки по умолчанию в приложении (то есть, кнопки, получающей событие click, когда пользователь нажимает клавишу Enter ), задайте свойство FocusManager.defaultButton . Например, в следующем коде в качестве кнопки по умолчанию задается экземпляр Button с именем submitButton . 

FocusManager.defaultButton = submitButton;

Когда в приложение добавляется компонент Button, его можно сделать доступным для программ чтения с экрана путем добавления следующих строк кода ActionScript. 

import fl.accessibility.ButtonAccImpl; 
 
ButtonAccImpl.enableAccessibility();

Расширенный доступ для компонента включается только один раз, независимо от числа созданных экземпляров.

Параметры компонента Button

В Инспекторе свойств («Окно» > «Свойства» > «Свойства») или Инспекторе компонентов («Окно» > «Инспектор компонентов») можно задать следующие параметры разработки для каждого экземпляра Button: emphasized , label , labelPlacement , selected и toggle . Каждый из этих параметров имеет соответствующее свойство ActionScript с тем же именем. При присвоении значения этим параметрам вы устанавливаете исходное состояние свойства в приложении. Установка свойства в ActionScript переопределяет значение, заданное параметру. Сведения о возможных значениях этих параметров см. в описании класса Button в справочнике ActionScript® 3.0 для Adobe® Flash® Professional CS5 .

Создание приложения с компонентом Button

Ниже описывается процедура добавления компонента Button в приложение в ходе разработки. В этом примере объект Button изменяет состояние компонента ColorPicker, когда пользователь щелкает объект мышью.

  1. Создайте новый документ Flash (ActionScript 3.0).

  2. Перетащите компонент Button с панели «Компоненты» в рабочую область и введите следующие значения в Инспекторе свойств.

    • Введите имя экземпляра aButton .

    • Введите значение Show (Показать) для параметра label.

  3. Добавьте компонент ColorPicker в рабочую область и присвойте ему имя экземпляра aCp .

  4. Откройте панель «Действия», выберите «Кадр 1» на главной временной шкале и введите следующий код ActionScript. 

    aCp.visible = false; 
 
aButton.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
     
    switch(event.currentTarget.label) { 
        case "Show": 
            aCp.visible = true; 
            aButton.label = "Disable"; 
            break; 
        case "Disable": 
            aCp.enabled = false; 
            aButton.label = "Enable"; 
            break; 
        case "Enable": 
            aCp.enabled = true; 
            aButton.label = "Hide"; 
            break; 
        case "Hide": 
            aCp.visible = false; 
            aButton.label = "Show"; 
            break; 
    } 
}

    Во второй строке кода функция clickHandler() регистрируется в качестве обработчика для события MouseEvent.CLICK . Событие происходит, когда пользователь щелкает компонент Button, в результате чего функция clickHandler() выполняет одно из следующих действий в зависимости от значения Button:

    • «Show» (Показать) делает экземпляр ColorPicker видимым и изменяет метку компонента Button на «Disable» (Выключить).

    • «Disable» (Выключить) отключает экземпляр ColorPicker и меняет метку Button на «Enable» (Включить).

    • «Enable» (Включить) включает экземпляр ColorPicker и меняет метку Button на «Hide» (Скрыть).

    • «Hide» (Скрыть) делает экземпляр ColorPicker невидимым и меняет метку Button на «Show» (Показать).

  5. Для запуска приложения выберите команды «Управление» > «Тестировать ролик».

Создание приложения с компонентом Button

Ниже приводится процесс создания кнопки-переключателя Button с использованием ActionScript, а также описывается тип события на панели «Вывод» при щелчке экземпляра Button. В этом примере создается экземпляр Button путем вызова конструктора класса и добавляется в рабочую область путем вызова метода addChild() .

  1. Создайте новый документ Flash (ActionScript 3.0).

  2. Перетащите компонент Button с панели «Компоненты» на панель «Библиотека» текущего документа.

    В результате этого компонент добавляется в библиотеку, но остается невидимым в приложении.

  3. Откройте панель «Действия», выберите «Кадр 1» в главной временной шкале и введите следующий код, чтобы создать экземпляр Button. 

    import fl.controls.Button; 
 
var aButton:Button = new Button(); 
addChild(aButton); 
aButton.label = "Click me"; 
aButton.toggle =true;  
aButton.move(50, 50);

    Метод move() размещает кнопку в точке рабочей области с координатами 50 (x), 50 (y).

  4. Теперь добавьте следующий код ActionScript, чтобы создать прослушиватель событий и функцию обработчика событий. 

    aButton.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
    trace("Event type: " + event.type); 
}

  5. Выберите «Управление» > «Тестировать ролик».

    При щелчке кнопки Flash показывает сообщение «Тип события: click» на панели «Вывод».