加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

介绍Flex的ButtonBar和ToggleButtonBar控件

发布时间:2020-12-15 04:25:26 所属栏目:百科 来源:网络整理
导读:介绍Flex的ButtonBar和ToggleButtonBar控件 2009-04-27 22:13:02 标签: ButtonBar Flex 休闲 职场 ToggleButtonBar 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 、作者信息和本声明。否则将追究法律责任。 http://www.voidcn.com/artic
介绍Flex的ButtonBar和ToggleButtonBar控件 2009-04-27 22:13:02
标签: ButtonBar Flex 休闲 职场 ToggleButtonBar
原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 、作者信息和本声明。否则将追究法律责任。 http://www.voidcn.com/article/p-krvxwinf-bgc.html
简介
BttonBar和ToggleButtonBar控件为相关的按钮定义了一个水平或垂直的、具有公共外观的布局。这两个控件只定义了一个叫做itemClick的事件,该事件在控件中任何按钮被选择的时候调度。
?
ButtonBar控件定义了一个不持有存储状态的按钮组。当你在一个ButtonBar种选择一个按钮的时候,这个按钮的外观改变为选择状态,当释放这个按钮时,它将返回未选择状态。
?
ToggleButtonBar控件定义了一个维持其选择或未选择状态的按钮组。在ToggleButtonBar控件中,只有以一个按钮可以处于被选择状态。这意味着当你在ToggleButtonBar控件中选择一个按钮时,这个按钮将一直处于被选择状态,直到你选择了另一个按钮。
?
如果你设置ToggleButtonBar控件的toggleOnClick属性未true,那么再次选择当前已选择的按钮,将使它返回未选择状态。默认情况下toggleOnClick属性为false。
?
创建一个ButtonBar控件
< mx:ButtonBar borderStyle ="solid" horizontalGap ="5" >?
?? < mx:dataProvider >?
???? < mx:String >Flash </ mx:String >?
???? < mx:String >Director </ mx:String >?
???? < mx:String >Dreamweaver </ mx:String >?
???? < mx:String >ColdFusion </ mx:String >?
?? </ mx:dataProvider >?
</ mx:ButtonBar >??
?
要创建一个ToggleButtonBar空间,之需要将<mx:ButtonBart>标签替换为<mx:ToggleButtonBar>标签。对于ToggleButtonBar控件,selectedIndex属性块iedomge当控件被创建的时候,哪个按钮处于被选择状态,默认值是0,即使最左侧的按钮处于被选择状态。设置selectedIndex属性为-1将使所有按钮处于未选择状态。dataProvicer属性定义了按钮的标签。你也可以向dataProvider属性传递一个对象数组,其中每个对象可以有三个字段:label,icon和toolTip。
?
< mx:ButtonBar borderStyle ="solid" horizontalGap ="5" >
???? < mx:dataProvider >
?????? < mx:Object label ="Flash" icon ="@Embed(source='../img/feedicon_001.png')" />
?????? < mx:Object label ="Director" icon ="@Embed(source='../img/feedicon_002.png')" />
?????? < mx:Object label ="Dreamweaver" icon ="@Embed(source='../img/feedicon_003.png')" />
?????? < mx:Object label ="ColdFusion" icon ="@Embed(source='../img/feedicon_004.png')" />
???? </ mx:dataProvider >
?
ButtonBar或ToggleButtonBar控件基于dataProvider属性的值创建按钮。即使ButtonBar和ToggleButtonBar是Container的子类,也不要使用Container.addChild()和Container.removeItem()方法来添加或移除按钮,而应使用addItem()和removeItem方法来操作dataProvider属性。ButtonBar或ToggleButtonBar控件可以自动的根据dataProvider属性的变化添加或移除按钮。
?
处理ButtonBar事件
当你选择一个按钮的时候,ButtonBar和ToggleButtonBar控件将调度一个itemClick事件。传递给事件监听器的event对象的类型为ItemClickEvent。在事件监听器中,你可以通过访问event对象的属性来确定被选择的按钮和其他信息。第一个按钮的索引是0。
?
< mx:Script >
??<![CDATA[
????import mx.events.ItemClickEvent;
??????private var savedIndex:int = 99999;
??????private function clickHandler(event:ItemClickEvent):void {
????????if (event.index == savedIndex) {
??????????myTA.text=""
????????}
????????else {
??????????savedIndex = event.index;
??????????myTA.text="Selected button index: " + String(event.index) + "n" + "Selected button label: " +event.label;
????????}
??????}
??]]>
?? </ mx:Script >
?? < mx:ToggleButtonBar
???? borderStyle ="solid"
???? horizontalGap ="5"
???? itemClick ="clickHandler(event);"
???? toggleOnClick ="true"
???? selectedIndex ="-1" >
???? < mx:dataProvider >
?????? < mx:String >Flash </ mx:String >
?????? < mx:String >Director </ mx:String >
?????? < mx:String >Dreamweaver </ mx:String >
?????? < mx:String >ColdFusion </ mx:String >
???? </ mx:dataProvider >
?? </ mx:ToggleButtonBar >
?? < mx:TextArea id ="myTA" width ="250" height ="100" />

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读