代码如下:
<?xml version="1.0" encoding="utf-8"?>
<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" minWidth="955" minHeight="600">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.FlexEvent;
protected function button1_clickHandler(event:MouseEvent):void
{
Alert.show(radiogroup1.selectedValue.toString());
}
protected function radiobutton1_creationCompleteHandler(event:FlexEvent):void
{
var rb:RadioButton =event.currentTarget as RadioButton;
if(rb==radiogroup1.getRadioButtonAt(0))
{
rb.selected = true;
}
}
]]>
</fx:Script>
<fx:Declarations>
<fx:Array id="arr">
<fx:Object label="北京" data="010" />
<fx:Object label="上海" data="021" />
<fx:Object label="天津" data="022" />
<fx:Object label="重庆" data="023" />
<fx:Object label="广州" data="020" />
</fx:Array>
<s:RadioButtonGroup id="radiogroup1" />
</fx:Declarations>
<s:Button x="336" y="316" label="按钮" click="button1_clickHandler(event)"/>
<mx:VBox x="100" y="200" height="200" width="200" borderVisible="true" borderStyle="outset">
<mx:Repeater dataProvider="{arr}" id="radioRepeater" x="52" y="38">
<s:RadioButton label="{radioRepeater.currentItem.label}" value="{radioRepeater.currentItem.data}" groupName="radiogroup1" creationComplete="radiobutton1_creationCompleteHandler(event)" />
</mx:Repeater>
</mx:VBox>
</s:Application>
1.首先先用fx:Array生成数据对象,fx:Array需要放在fx:Declarations声明部分
2.添加一个s:RadioButtonGroup,也需要放在fx:Declarations声明部分
3.添加一个mx:Repeater组件,并在mx:Repeater组件内添加一个s:RadioButton组件
给mx:Repeater组件设置数据源,那么数据源有几条数据,就会生成几个RadioButton
由于mx:Repeater组件必须包在基于Halo的容器中,所以还需要在mx:Repeater组件外包一个mx:VBox组件
4.通过radiogroup1.selectedValue.toString(),可以获取当前选择项的value值
5.如果需要默认绑定第一个RadioButton,可以在RadioButton组件添加creationComplete事件,监测如果是第一项,就选中
分享到:
相关推荐
4. **设置事件监听器**:在RadioButton上设置一个事件监听器,如`change`事件,当用户点击RadioButton时触发,更新数据源以反映用户的选择。 5. **应用自定义渲染器**:将这个自定义渲染器应用到DataGrid的相应列上...
DataGrid是一种用于展示数据列表的组件,能够通过dataProvider属性绑定数据源。而RadioButton是一种单选按钮,通常用于实现多个选项中只能选择一个的场景。 实现思路分为几个步骤: 1. 准备DataGrid组件,并设置其...
值得注意的是,示例中定义了一个名为chartArray的ArrayCollection对象,它绑定了图表组件的数据源。chartArray数组包含了星期和对应苹果、橘子、桃子数量的对象,这些对象的数据会根据RadioButton的选择在柱状图和...
当数据源发生变化时,界面会自动更新,反之亦然,无需编写额外的事件监听代码。 4. **事件处理** Flex应用中的事件处理是通过事件监听器实现的。开发者可以注册事件监听器来响应用户交互或其他系统事件,从而实现...
例如,如果数据源中有一个名为`creationDate`的字段,可以这样绑定: ```actionscript dateField.dataField = "creationDate"; ``` 4. **处理事件** 如果需要在用户与ItemRenderer交互时执行某些操作,可以...
- 数据提供程序控件可以从数据源获取数据,如ArrayCollection,可以通过数据绑定或者直接在MXML中定义数据源来设置。数据绑定允许控件实时响应数据源的变化,增强了应用程序的动态性。 使用FlexBuilder,开发者...
这些控件可以从数据源获取数据列表,数据源可以是静态的数组或动态的数据提供程序。 - **直接在MXML中定义数据提供程序**:这种方法简单快捷,适合处理静态数据或进行原型设计。例如,可以直接在MXML标签内定义一个...
这些控件可以根据数据源动态展示列表内容。数据提供有两种方式:一是直接在MXML中定义数据,如Array或Collection,适用于静态数据和原型设计;二是通过数据绑定,将控件与ActionScript中的Array或Collection绑定,...
- 支持绑定多种类型的数据源,如ArrayCollection、XMLList等。 - 支持数据分组、摘要显示、排序等功能。 ### Flex中的动画与导航 1. **Flex动画功能:** - Flex支持各种动画效果,包括3D动画。 - 可以通过MXML...
除了直接在MXML中定义数据外,还可以通过数据绑定的方式将控件与ActionScript中的数据源相连接。 - **数据绑定示例**: - 直接在MXML标签中定义数据: ```xml <!-- An inline data provider --> ```...
可以通过直接在MXML中定义数据源或使用数据绑定的方式连接到后端数据。 3. **使用数据绑定和重复器(Repeater)**: - 数据绑定是Flex中非常重要的特性,它允许控件自动更新以反映数据模型的变化。使用`[Bindable]`...
Flex框架还提供了强大的数据通信能力,包括与服务器端数据源的交互。例如,`<mx:HTTPService>`组件可以用于发送HTTP请求,获取或提交数据。这种双向数据绑定的能力,使得Flex应用能够实时地响应数据变化,提供流畅的...
在Flex3.5中,`mx.controls`还引入了数据绑定和样式系统,使得控件可以动态地反映数据模型的变化,而无需手动更新界面。此外,Flex的组件模型允许开发者使用MXML和ActionScript混合编程,提供了更高的灵活性和效率。...
通过以上对《Flex 3 组件实例与应用》一书中提到的各类组件的介绍,我们可以看出Flex 3提供的组件不仅涵盖了基本的UI需求,还包括了高级的交互、数据展示和验证等功能。这使得开发者能够在构建复杂的应用程序时更加...
然而,与HTML表格不同的是,`GridRow`提供了更高级的定制能力,包括但不限于动态调整列宽、自定义单元格样式以及数据绑定。 在实现仿HTML表单的功能时,`GridRow`可以被用来创建表单字段的布局,每个`GridRow`可以...
DataProvider 是一种数据结构,用于向基于 List 的组件提供数据源。 **使用 CellRenderer** CellRenderer 用于定义列表或网格中每个单元格的外观。 **使组件具有辅助功能** 通过设置合适的属性和事件,可以使...
14. **Data-bound combobox(数据绑定组合框)**: 使用前缀`dbcbo`,例如:`dbcboLanguage`表示语言选择的数据绑定组合框。 15. **Data-bound grid(数据绑定网格)**: 使用前缀`dbgrd`,例如:`dbgrdQueryResult`...