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

Компонент RadioButton позволяет поставить пользователя перед выбором единственного варианта из нескольких. Этот компонент должен использоваться в группе, где существует не менее двух экземпляров RadioButton. В любое время можно выбрать только одного члена данной группы. Выбор переключателя в группе снимает выделение с выбранного в данный момент переключателя в этой группе. Параметр groupName задается для того, чтобы указать, к какой группе принадлежит переключатель.

Переключатель является основной частью многих приложений с веб-формами. Переключатели можно использовать, когда пользователь должен выбрать один вариант из нескольких. Например, переключатели можно использовать в форме, чтобы узнать у заказчика, какой кредитной картой он хочет воспользоваться.

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

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

Клавиша

Описание

«Стрелка вверх»/«Стрелка влево»

Выделение перемещается на предыдущий переключатель в группе.

«Стрелка вниз»/«Стрелка вправо»

Выделение перемещается на следующий переключатель в группе.

Табуляция

Фокус перемещается с группы переключателей на следующий компонент.

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

Интерактивный просмотр каждого элемента RadioButton в рабочей области отражает изменения, которые были внесены в параметры в Инспекторе свойств или Инспекторе компонентов во время разработки. Однако в интерактивном просмотре не отображается взаимоисключение выделения. Если задать значение true параметрам selected двух переключателей в одной группе, они оба отображаются выбранными, даже если только последний созданный экземпляр выбран во время выполнения. Дополнительные сведения см. в разделе « Параметры компонента RadioButton ».

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

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

Расширенный доступ для компонента включается только один раз, независимо от числа имеющихся экземпляров. Дополнительные сведения см. в главе 18 «Создание содержимого с расширенной доступностью» в руководстве «Использование Flash» .

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

В Инспекторе свойств или Инспекторе компонентов можно задать следующие параметры разработки для каждого экземпляра компонента RadioButton: groupName, label, LabelPlacement, selected и value . Каждый из этих параметров имеет соответствующее свойство ActionScript с тем же именем. Сведения о возможных значениях этих параметров см. в описании класса RadioButton в справочнике ActionScript® 3.0 для Adobe® Flash® Professional CS5 .

Можно написать код ActionScript, чтобы задать дополнительные параметры для экземпляров RadioButton с помощью методов, свойств и событий класса RadioButton.

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

Ниже описывается процедура добавления компонентов RadioButton в приложение в ходе разработки. В данном примере экземпляры RadioButton используются для выбора ответа «да» или «нет» на заданный вопрос. Данные, полученные от RadioButton, отображаются в экземпляре TextArea.

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

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

  3. Выберите первый переключатель. В Инспекторе свойств присвойте ему имя экземпляра yesRb и имя группы rbGroup.

  4. Выберите второй переключатель. В Инспекторе свойств присвойте ему имя экземпляра noRb и имя группы rbGroup.

  5. Перетащите компонент TextArea с панели «Компоненты» в рабочую область и присвойте ему имя экземпляра aTa .

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

    yesRb.label = "Yes"; 
yesRb.value = "For"; 
noRb.label = "No"; 
noRb.value = "Against"; 
 
yesRb.move(50, 100); 
noRb.move(100, 100); 
aTa.move(50, 30); 
noRb.addEventListener(MouseEvent.CLICK, clickHandler); 
yesRb.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
    aTa.text = event.target.value; 
}

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

Создание компонента RadioButton с помощью ActionScript

В этом примере с помощью ActionScript создается три экземпляра RadioButton для красного, синего и зеленого цветов и рисуется серое окно. Свойство value каждого экземпляра RadioButton определяет шестнадцатеричное значение цвета, связанное с данным переключателем. Когда пользователь щелкает по одному из экземпляров RadioButton, функция clickHandler() вызывает метод drawBox() и передает цвет из свойства value экземпляра RadioButton для изменения цвета серого окна.

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

  2. Перетащите компонент RadioButton на панель «Библиотека».

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

    import fl.controls.RadioButton; 
import fl.controls.RadioButtonGroup; 
 
var redRb:RadioButton = new RadioButton(); 
var blueRb:RadioButton = new RadioButton(); 
var greenRb:RadioButton = new RadioButton(); 
var rbGrp:RadioButtonGroup = new RadioButtonGroup("colorGrp"); 
 
var aBox:MovieClip = new MovieClip(); 
drawBox(aBox, 0xCCCCCC); 
 
addChild(redRb); 
addChild(blueRb); 
addChild(greenRb); 
addChild(aBox); 
 
redRb.label = "Red"; 
redRb.value = 0xFF0000; 
blueRb.label = "Blue"; 
blueRb.value = 0x0000FF; 
greenRb.label = "Green"; 
greenRb.value = 0x00FF00; 
redRb.group = blueRb.group = greenRb.group = rbGrp; 
redRb.move(100, 260); 
blueRb.move(150, 260); 
greenRb.move(200, 260); 
 
rbGrp.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
    drawBox(aBox, event.target.selection.value); 
} 
 
function drawBox(box:MovieClip,color:uint):void { 
            box.graphics.beginFill(color, 1.0); 
            box.graphics.drawRect(125, 150, 100, 100); 
            box.graphics.endFill();         
}

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

    Дополнительные сведения см. в описании класса RadioButton в справочнике ActionScript® 3.0 для Adobe® Flash® Professional CS5 .