RadioButton 组件允许您强制用户在一组选择中选择一项。该组件必须用于至少有两个 RadioButton 实例的组。在任何给定的时刻,都只有一个组成员被选中。选择组中的一个单选按钮将取消选择组内当前选定的单选按钮。您可以设置
groupName
参数,以指示单选按钮属于哪个组。
单选按钮是 Web 上许多表单应用程序的基础部分。如果您需要让用户从一组选项中做出一个选择,可以使用单选按钮。例如,在表单上询问客户要使用哪种信用卡时,您就可以使用单选按钮。
与 RadioButton 组件的用户交互
可以启用或禁用单选按钮。禁用的单选按钮不接收鼠标或键盘输入。当用户单击或使用 Tab 切换到 RadioButton 组件组时,只有选定的单选按钮会接收焦点。然后用户就可以使用以下按键来控制它:
键
|
说明
|
向上箭头/向左箭头
|
所选项会移至单选按钮组内的前一个单选按钮。
|
向下箭头/向右箭头
|
选择将移到单选按钮组的下一个单选按钮。
|
Tab
|
将焦点从单选按钮组移动到下一个组件。
|
有关控制焦点的详细信息,请参阅
《用于 Adobe® Flash® Professional CS5 的 ActionScript® 3.0 参考》
中的 IFocusManager 接口和 FocusManager 类以及
使用 FocusManager
。
每个 RadioButton 实例在舞台上的实时预览反映在创作过程中对“属性”检查器或“组件”检查器中的参数所做的更改。但是,实时预览中不会显示互斥的所选项。如果将同组的两个单选按钮的 selected 参数都设置为
true
,则它们都会显示为选中状态,但是在运行时只有最后创建的实例才显示为选中状态。有关详细信息,请参阅
RadioButton 组件参数
。
在将 RadioButton 组件添加到应用程序时,可以添加以下几行代码,以使其可由屏幕阅读器访问:
import fl.accessibility.RadioButtonAccImpl;
RadioButtonAccImpl.enableAccessibility();
不管组件有多少实例,都只对组件启用一次辅助功能。有关详细信息,请参阅《使用 Flash》中的第 18 章“创建具有辅助功能的内容”
。
RadioButton 组件参数
您可以在“属性”检查器或“组件”检查器中为每个 RadioButton 组件实例设置下列创作参数:
groupName、label、LabelPlacement、selected
和
value
。其中每个参数都有对应的同名 ActionScript 属性。有关这些参数的可能值的信息,请参阅
《用于 Adobe® Flash® Professional CS5 的 ActionScript® 3.0 参考》
中的 RadioButton 类。
您可以编写 ActionScript,通过利用 RadioButton 类的方法、属性和事件来设置 RadioButton 实例的其他选项。
创建具有 RadioButton 组件的应用程序
以下过程解释了如何在创作时将 RadioButton 组件添加到应用程序。在此示例中,使用 RadioButton 表示是非问题。RadioButton 的数据显示在 TextArea 中。
-
创建一个新的 Flash (ActionScript 3.0) 文档。
-
将两个 RadioButton 组件从“组件”面板拖到舞台上。
-
选择第一个单选按钮。在“属性”检查器中,为其指定实例名称
yesRb
和组名称
rbGroup
。
-
选择第二个单选按钮。在“属性”检查器中,为其指定实例名称
noRb
和组名称
rbGroup
。
-
将一个 TextArea 组件从“组件”面板拖到舞台上,并为其指定实例名称
aTa
。
-
打开“动作”面板,在主时间轴中选择第 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;
}
-
选择“控制”>“测试影片”以运行此应用程序。
使用 ActionScript 创建 RadioButton
此示例使用 ActionScript 创建三个 RadioButton,分别表示红色、蓝色和绿色,并绘制一个灰色的框。每个 RadioButton 的
value
属性指定与此按钮关联的颜色的十六进制值。当用户单击其中一个 RadioButton 时,
clickHandler()
函数将调用
drawBox()
,同时传递此 RadioButton 的
value
属性中的颜色值来为此框着色。
-
创建一个新的 Flash (ActionScript 3.0) 文档。
-
将一个 RadioButton 组件拖到“库”面板中。
-
打开“动作”面板,在主时间轴中选择第 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();
}
-
选择“控制”>“测试影片”以运行此应用程序。
有关详细信息,请参阅
《用于 Adobe® Flash® Professional CS5 的 ActionScript® 3.0 参考》
中的 RadioButton 类。
|
|
|