FLEX组件继承关系

发布时间：2020-12-15 05:15:55 所属栏目：百科来源：网络整理

导读：? [c-sharp] view plain copy print ? ???1.?Spacer??:?占位符，让图片隔开?? ?? ?? ??mx:Image?source= "@Embed['../assets/2.png']" /?? ??mx:Spacer?width= "100%" /?? ??mx:Image?source= "@Embed['../assets/8.png']" ?/?? ?? ??? ?? ???2.ProgressBar?

[c-sharp] view plain copy print ?

???1.?Spacer??:?占位符，让图片隔开??
??
??
??<mx:Image?source="@Embed['../assets/2.png']"/>??
??<mx:Spacer?width="100%"/>??
??<mx:Image?source="@Embed['../assets/8.png']"?/>??
??
???
??
???2.ProgressBar??加载条??
??
??
??minimum="0"?最小值，即起始值??
??maximum="100"?最大值，??最终值??
??mode="manual"模板，设置为手动??
??
???
??
??public?function?runit():void{??
?if(j<=100)??
?????{??
?bar.setProgress(j,100);//当前加载值，100为加载总值 ??
?bar.label=?"CurrentProgress"?+?"?"?+?j?+?"%";//在舞台上显示加载的百分比 ??
??
???j+=5??
?????}??
??
??if(j>100)??
?????{??
???j=0;//到100时，清零 ??
????}???
????????????}???
??
???
??
?3.?NumericStepper数字微调（默认属性为整形，属性为隐藏状态，无须设置）??
??
???
??
???<mx:NumericStepper?x="48"?y="177"?id="ns"?minimum="10.00"??maximum="45.00"?stepSize="0.02"?value="20"/>??
??//stepsize表示步长，value表?示是起始值 ??
??<mx:Label?text="You?Select:{ns.value}"?x="48"?y="209"/>??
??
???
??
?4.VRul（一般在容器组件中用于分隔其它组件）??
??
??
rollOverEffect="WipeUp"特效??
strokeWidth="1"伸展方向，由上往下??
??
???
??
5.VSlider?垂直滑动条??
??
???
??
??tickColor?:表示刻度上的颜色??
??minimum?和?maximum?:滑动范围??
??tickInterval：每隔一段距离显示标记，间隔距离??
??dataTipPlacemnt="Top"//拖动滑动条的时候，上方提示所在的位置 ??
??value?=100//滑动条的初始值100 ??
??liveDragging="true"//实施拖动效果 ??
??labes="['0%',"100%"]"?//表示滑动条两端显示的最小和最大的数字 ??
??snapInterval?="1"??//最小滑动间隔为1 ??
?同时使用两个箭头标记：?thumbCount?（?1?或?2?，默认值为?1?）???
?使用双箭头的时候设置初始值需要用?values?数组（如?values='[?20?,?80?]'?）???
???
?6.?VcrollBars??
??
??
???minScrollPosition="0"//最小滚动位置 ??
???maxScrollPosition="{panel.width?-?20}"??//这里设置的最大滚动位置为面板?的宽度减去20，panel为面板的id ??
???lineScrollSize="50"?//点击上下标的位置前进为50步长 ??
???pageScrollSize="100"?//?点击VcrollBars滚动按钮空白处滚动的步长为100 ??
???repeatDelay="1000"?//按下滚动条上按钮时响应的时间间隔，单位为毫秒 ??
???repeatInterval="500"??????
???scroll="myScroll(event)//添加滚动事件 ??
??
???
??
??7.Button??
??
??
??toggle="true"//当点击的时候显示被按住的状态 ??
??icon="@Embed('../assets/6.gif')"//按钮中插入图片 ??
常用属性：??
　　1、emphasized：获取或设置一个布尔值，指示当按钮处于弹起状态时，Button?组件周围是否绘有边框。默认为：??
false??
　　2、Label:按扭上显示的文本。??
　　3、Icon:按扭上显示的图标。如：icon="@Embed('Images/mm-icon.png')"??
　　4、click:按扭的监听单击事件所的方法。除了click也可以监听它的其他识见，如mouseMove、mouSEOver、mouSEOut、rollOver、rollOut、mouseDown?和?mouseUp。??
??
??
?8.ButtonBar??
??
???
??
?<mx:ButtonBar?itemClick="chilkhandler(event);">??
?????<mx:dataProvider>//提供数据源 ??
?????????<mx:Array>??
????<mx:String>Flex</mx:String>??
????<mx:String>Jsp</mx:String>??
???<mx:String>Flash</mx:String>??
???<mx:String>Php</mx:String>???
???????????</mx:Array>??
????</mx:dataProvider>??
</mx:ButtonBar>??
??
???
??
?9.Linbar的属性??
??
???
??
horizontalGap水平方向各链接之间的间隔数值从0~20??
separatorWidth间隔线的粗细各链接之间间隔线的粗细数值从0~20??
separatorColor间隔线的颜色??
borderStyleLinkBar的边框样式??
nonesolidborderColor边框颜色??
borderThickness边框粗细程度数值从0~20??
cornerRadius边框圆角度数值从0~20??
dropShadowEnabled是否显示边框投影true和false??
shadowDistance投影大小数值从0~20??
shadowDirection投影方向leftcenterright??
dropShadowColor投影颜色??
backgroundAlpha背景色透明度数值从0.00~1.00???
??
??
10.LinkButton??
??
??
(和button的用法雷同，进外观有所差别)??
??
??
11.PopupButton??
??
??
???通常都是与其他的组件(如菜单--Menu)一起配合使用,实现的功能有点类似与ComBoBox的效果??
??
??
12.RedioButton??
??
??
(同一组按钮中仅能选中一个)??
groupName:指定这个按钮分为哪一组??
??
??
13.RedioButtonGrop??
??
??
(与RedioButton的用法类似，可以给相同类似的组件指定一个事件，这样可以减少代码量)??
??
例如：??
?????import?mx.events.ItemClickEvent;??
?????import?mx.controls.Alert;??
public?function?handlecard(event:ItemClickEvent):void??
???{??
if?(event.currentTarget.selectedValue=="a")??
??????{??
Alert.show("你选择了邮政卡！")??
???????}??
else?{??
??????????if?(event.currentTarget.selectedValue=="b")??
?????????{??
?????????????Alert.show("你选择了招商卡！")??
???????????}???else??
??????????????????{??
?????????????????Alert.show("你选择了农行卡！")??
??????????????????}??
???????}??
?}??
?????????
????<mx:RadioButtonGroup?id="ra"?itemClick="handlecard(event);"?/>??
????<mx:RadioButton??label="邮政银行"?groupName="ra"?value="a"/>??
????<mx:RadioButton??label="招商银行"?groupName="ra"?value="b"/>??
????<mx:RadioButton??label="农业银行"?groupName="ra"?value="c"/>??
??
???
??
14.Togglebuttonbar??
??
???
??
?（?ToggleButtonBar组件和ButtonBar类似，仅仅在按下的时候按钮的样式缩??下去）??
??
??
??15.Datechoser??Datafield??
??
???
??
???DataChooser和DataField使得用户可以从图形日历中选择日期。??????DataChooser控件的用户界面是一个日历，而DataField则由一个text域和小??????图标组成，点击小图标会出现图形化的日历，选择日期的结果将会放在text?????域中。??
??
<mx:DateFormatter?id="df"/>//格式化输出 ??
?<mx:DateChooser?id="dateChooser2"?yearNavigationEnabled="true"??
?????disabledRanges="{[?{rangeEnd:?new?Date(2006,?5,?1)}?]}"/>//?选择年得导????航?和静止范围的属性 ??
<mx:Label?text="Date?selected:?{df.format(dateChooser2.selectedDate)}"/>??

1. Spacer  : 占位符，让图片隔开

<mx:Image source="@Embed['../assets/2.png']"/>
  <mx:Spacer width="100%"/>
  <mx:Image source="@Embed['../assets/8.png']" />

2.ProgressBar  加载条

minimum="0" 最小值，即起始值
  maximum="100" 最大值，  最终值
  mode="manual"模板，设置为手动

public function runit():void{
 if(j<=100)
     {
 bar.setProgress(j,100);//当前加载值，100为加载总值
 bar.label= "CurrentProgress" + " " + j + "%";//在舞台上显示加载的百分比

j+=5
     }

if(j>100)
     {
   j=0;//到100时，清零
    } 
            }

3. NumericStepper数字微调（默认属性为整形，属性为隐藏状态，无须设置）

<mx:NumericStepper x="48" y="177" id="ns" minimum="10.00"  maximum="45.00" stepSize="0.02" value="20"/>
  //stepsize表示步长，value表 示是起始值
  <mx:Label text="You Select:{ns.value}" x="48" y="209"/>

4.VRul（一般在容器组件中用于分隔其它组件）

rollOverEffect="WipeUp"特效
strokeWidth="1"伸展方向，由上往下

5.VSlider 垂直滑动条

tickColor :表示刻度上的颜色
  minimum 和 maximum :滑动范围
  tickInterval：每隔一段距离显示标记，间隔距离
  dataTipPlacemnt="Top"//拖动滑动条的时候，上方提示所在的位置
  value =100//滑动条的初始值100
  liveDragging="true"//实施拖动效果
  labes="['0%',"100%"]" //表示滑动条两端显示的最小和最大的数字
  snapInterval ="1"  //最小滑动间隔为1
 同时使用两个箭头标记： thumbCount （ 1 或 2 ，默认值为 1 ） 
 使用双箭头的时候设置初始值需要用 values 数组（如 values='[ 20,80 ]' ） 
 
 6. VcrollBars

minScrollPosition="0"//最小滚动位置
   maxScrollPosition="{panel.width - 20}"  //这里设置的最大滚动位置为面板 的宽度减去20，panel为面板的id
   lineScrollSize="50" //点击上下标的位置前进为50步长
   pageScrollSize="100" // 点击VcrollBars滚动按钮空白处滚动的步长为100
   repeatDelay="1000" //按下滚动条上按钮时响应的时间间隔，单位为毫秒
   repeatInterval="500"    
   scroll="myScroll(event)//添加滚动事件

7.Button

toggle="true"//当点击的时候显示被按住的状态
  icon="@Embed('../assets/6.gif')"//按钮中插入图片
常用属性：
　　1、emphasized：获取或设置一个布尔值，指示当按钮处于弹起状态时，Button 组件周围是否绘有边框。默认为：
false
　　2、Label:按扭上显示的文本。
　　3、Icon:按扭上显示的图标。如：icon="@Embed('Images/mm-icon.png')"
　　4、click:按扭的监听单击事件所的方法。除了click也可以监听它的其他识见，如mouseMove、mouSEOver、mouSEOut、rollOver、rollOut、mouseDown 和 mouseUp。

8.ButtonBar

<mx:ButtonBar itemClick="chilkhandler(event);">
     <mx:dataProvider>//提供数据源
         <mx:Array>
    <mx:String>Flex</mx:String>
    <mx:String>Jsp</mx:String>
   <mx:String>Flash</mx:String>
   <mx:String>Php</mx:String> 
           </mx:Array>
    </mx:dataProvider>
</mx:ButtonBar>

9.Linbar的属性

horizontalGap水平方向各链接之间的间隔数值从0~20
separatorWidth间隔线的粗细各链接之间间隔线的粗细数值从0~20
separatorColor间隔线的颜色
borderStyleLinkBar的边框样式
nonesolidborderColor边框颜色
borderThickness边框粗细程度数值从0~20
cornerRadius边框圆角度数值从0~20
dropShadowEnabled是否显示边框投影true和false
shadowDistance投影大小数值从0~20
shadowDirection投影方向leftcenterright
dropShadowColor投影颜色
backgroundAlpha背景色透明度数值从0.00~1.00

10.LinkButton

(和button的用法雷同，进外观有所差别)

11.PopupButton

通常都是与其他的组件(如菜单--Menu)一起配合使用,实现的功能有点类似与ComBoBox的效果

12.RedioButton

(同一组按钮中仅能选中一个)
groupName:指定这个按钮分为哪一组

13.RedioButtonGrop

(与RedioButton的用法类似，可以给相同类似的组件指定一个事件，这样可以减少代码量)

例如：
     import mx.events.ItemClickEvent;
     import mx.controls.Alert;
public function handlecard(event:ItemClickEvent):void
   {
if (event.currentTarget.selectedValue=="a")
      {
Alert.show("你选择了邮政卡！")
       }
else {
          if (event.currentTarget.selectedValue=="b")
         {
             Alert.show("你选择了招商卡！")
           }   else
                  {
                 Alert.show("你选择了农行卡！")
                  }
       }
 }
       
    <mx:RadioButtonGroup id="ra" itemClick="handlecard(event);" />
    <mx:RadioButton  label="邮政银行" groupName="ra" value="a"/>
    <mx:RadioButton  label="招商银行" groupName="ra" value="b"/>
    <mx:RadioButton  label="农业银行" groupName="ra" value="c"/>

14.Togglebuttonbar

（ ToggleButtonBar组件和ButtonBar类似，仅仅在按下的时候按钮的样式缩  下去）

15.Datechoser  Datafield

DataChooser和DataField使得用户可以从图形日历中选择日期。      DataChooser控件的用户界面是一个日历，而DataField则由一个text域和小      图标组成，点击小图标会出现图形化的日历，选择日期的结果将会放在text     域中。

<mx:DateFormatter id="df"/>//格式化输出
 <mx:DateChooser id="dateChooser2" yearNavigationEnabled="true"
     disabledRanges="{[ {rangeEnd: new Date(2006,5,1)} ]}"/>// 选择年得导    航 和静止范围的属性
<mx:Label text="Date selected: {df.format(dateChooser2.selectedDate)}"/>

（编辑：李大同）

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