Flex的TabBar控件

简介TabBar控件定义了卡片(tab)的水平或垂直的布局。TabBar控件与TabNavigator控件类似,但是它没有任何子容器。例如,你使用TabNavigator容器的卡片来选择它可见得 子容器。对于TabBar容器,你通过设置一个独立容器的课件内容来使那个容器的子元素在被选择的标签中可见或不可见。? 创建一个TabBar控件<mx:TabBar>
<mx:dataProvider>
<mx:String>Alabama</mx:String>
<mx:String>Alaska</mx:String>
<mx:String>Arkansas</mx:String>
</mx:dataProvider>
</mx:TabBar>?你也可以使用<mx:Object>标签来定义对象数组的成员,每个对象包含一个label属性和一个相关的data属性。?<mx:TabBar>
<mx:dataProvider>
<mx:Object label="Alabama" data="Montgomery"/>
<mx:Object label="Alaska" data="Juneau"/>
<mx:Object label="Arkansas" data="Little Rock"/>
</mx:dataProvider>
</mx:TabBar>label属性包含了状态的名称,data属性可以然你将一个数值与文本标签相关联。例如,label的文本可以某个颜色的名称,相关联的 data属性的值则是该颜色的数字表现形式。?默认的,Flex使用label属性的值来定义卡片的文本。如果对象没有包含一个label属性,你可以使用TabBar控件的 labelField属性来制定包含了卡片文本的属性名称。?<mx:TabBar labelField="state">
<mx:dataProvider>
<mx:Object state="Alabama" data="Montgomery"/>
<mx:Object state="Alaska" data="Juneau"/>
<mx:Object state="Arkansas" data="Little Rock"/>
</mx:dataProvider>
</mx:TabBar>? 向TabBar控件传递数据Flex可以让你从一个ActionScript变量定义或一个Flex数据模型向TabBar空间传递数据。当你使用一个变量时,你可以定义 下列两种中的一种:一个标签(String)一对标签(String)和数据(标量值或对象)<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
private var STATE_ARRAY:ArrayCollection = new ArrayCollection([
{label:"Alabama", data:"Montgomery"},
{label:"Alaska", data:"Juneau"},
{label:"Arkansas", data:"LittleRock"}
]);
]]>
</mx:Script>
<mx:TabBar >
<mx:dataProvider>
{STATE_ARRAY}
</mx:dataProvider>
</mx:TabBar>? 处理TabBar控件事件TabBar控件定义了一个当用户选择一个卡片时将被传播的itemClick事件。event对象包含以下属性:label 包含了被选择卡片文本的字符串index 被选择卡片的索引值。需哦因是从0到卡片总数-1之间的数字,默认值是0,相当于第一个卡片。?<mx:Script>
<![CDATA[
import mx.events.ItemClickEvent;
import mx.controls.TabBar;
import mx.collections.ArrayCollection;
[Bindable]
private var STATE_ARRAY:ArrayCollection = new ArrayCollection([
{label:"Alabama", data:"Montgomery"},
{label:"Alaska", data:"Juneau"},
{label:"Arkansas", data:"LittleRock"}
]);
private function clickEvt(event:ItemClickEvent):void {
forClick.text="label is: "+event.label+"\\nindex is: "+event.index+" \\ncapital is: "+STATE_ARRAY.getItemAt(event.index).data;
}
]]>
</mx:Script>
<mx:TabBar id="myTB" itemClick="clickEvt(event);">
<mx:dataProvider>
{STATE_ARRAY}
</mx:dataProvider>
</mx:TabBar>
<mx:TextArea id="forClick" width="250" height="100"/>?
转自: http://flexria.blog.51cto.com/753638/153764
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值