flashbuilder4 单选 RadioButton RadioButtonGroup

来源：互联网发布：mac 远程编辑：程序博客网时间：2024/05/18 00:02

转载： http://www.fbair.net/bbs/read.php?tid=156

单选 RadioButton 和 RadioButtonGroup 控件介绍    RadioButtonGroup 相当于Html里面的<input type="radio" name="XXX"的Name属性，而RadioButton 相当于<input type="radio"的每个值

官方文档
http://help.adobe.com/zh_CN/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7d8b.html
http://help.adobe.com/zh_CN/AS3LCR/Flex_4.0/mx/controls/RadioButton.html
http://help.adobe.com/zh_CN/AS3LCR/Flex_4.0/spark/components/RadioButton.html

单选框 RadioButton 组件有2种分别包含在  MX and Spark 组件里面，官方建议使用spark组件里面的

RadioButtonGroup 由于是非可见元素需要放到 <fx:Declarations> 标签中

[pre]RadioButton 的 click事件  请查看如下例子中的 click="handleAmEx(event)", click="handleMC(event), click="handleVisa(event)

复制代码

<?xml version="1.0"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Script>
<![CDATA[
import flash.events.Event;
private function handleAmEx(event:Event):void {
// Handle event.
myTA.text="Got Amex";
}
private function handleMC(event:Event):void {
// Handle event.
myTA.text="Got MasterCard";
}
private function handleVisa(event:Event):void {
// Handle event.
myTA.text="Got Visa";
}
]]>
</fx:Script>
<s:VGroup>
<s:RadioButton groupName="cardtype"
id="americanExpress"
label="American Express"
width="150"
click="handleAmEx(event);"/>
<s:RadioButton groupName="cardtype"
id="masterCard"
label="MasterCard"
width="150"
click="handleMC(event);"/>
<s:RadioButton groupName="cardtype"
id="visa"
label="Visa"
width="150"
click="handleVisa(event);"/>
<s:TextArea id="myTA"/>
</s:VGroup>
</s:Application>

创建一组单选框由于所有的 RadioButton 都属于 cardtype 组所以可以直接用 cardtype.selectedValue 显示选中的值

复制代码

<?xml version="1.0"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Script>
<![CDATA[
import mx.events.ItemClickEvent;
private function handleCard(event:ItemClickEvent):void {
//Print the value of the selected RadioButton in the Text Area
var cardValue:Object = cardtype.selectedValue;
myTA.text="You selected " + cardValue;
}
]]>
</fx:Script>
<fx:Declarations>
<s:RadioButtonGroup id="cardtype"
itemClick="handleCard(event);"/>
</fx:Declarations>
<s:VGroup>
<s:RadioButton group="{cardtype}"
id="americanExpress"
label="American Express"
width="150"/>
<s:RadioButton group="{cardtype}"
id="masterCard"
label="MasterCard"
width="150"/>
<s:RadioButton group="{cardtype}"
id="visa"
label="Visa"
width="150"/>
<s:TextArea id="myTA"/>
</s:VGroup>
</s:Application>

通过设置的 “click点击” ItemClickEvent 监听器 private function handleCard(event:ItemClickEvent):void 来监听单选选择时的 click 事件

复制代码

<?xml version="1.0"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.ItemClickEvent;//需要导入该包
private function handleCard(event:ItemClickEvent):void {
if (event.currentTarget.selectedValue == "AmEx") {
Alert.show("You selected American Express.");
} else if (event.currentTarget.selectedValue == "MC") {
Alert.show("You selected MasterCard.");
} else {
Alert.show("You selected Visa.");
}
}
]]>
</fx:Script>
<fx:Declarations>
<s:RadioButtonGroup id="cardtype"
itemClick="handleCard(event);"/>
</fx:Declarations>
<s:VGroup>
<s:RadioButton group="{cardtype}"
id="americanExpress"
value="AmEx"
label="American Express"
width="150"/>
<s:RadioButton group="{cardtype}"
id="masterCard"
value="MC"
label="MasterCard"
width="150"/>
<s:RadioButton group="{cardtype}"
id="visa"
value="Visa"
label="Visa"
width="150"/>
</s:VGroup>
</s:Application>

通过键盘操作单选