Flex中如何利用getChildAt()和enabled属性控制ButtonBar中个别按钮有效状态的例子

By Minidxer | February 16, 2009

接下来的例子演示了Flex中如何利用getChildAt()和enabled属性,控制ButtonBar中个别按钮有效状态。

让我们先来看一下Demo可以右键View Source或点击这里察看源代码):


下面是完整代码(或点击这里察看):

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Style>
  8.         ButtonBar {
  9.             buttonStyleName: myCustomButtonStyleName;
  10.         }
  11.  
  12.         .myCustomButtonStyleName {
  13.             cornerRadius: 0;
  14.         }
  15.     </mx:Style>
  16.  
  17.     <mx:Script>
  18.         <![CDATA[
  19.             import mx.controls.buttonBarClasses.ButtonBarButton;
  20.  
  21.             private function toggleButton(idx:uint, selected:Boolean):void {
  22.                 var b3:ButtonBarButton = buttonBar.getChildAt(idx) as ButtonBarButton;
  23.                 b3.enabled = selected;
  24.             }
  25.         ]]>
  26.     </mx:Script>
  27.  
  28.     <mx:Array id="arr">
  29.         <mx:Object label="Button" />
  30.         <mx:Object label="ButtonBar" />
  31.         <mx:Object label="ColorPicker" />
  32.         <mx:Object label="ComboBox" />
  33.     </mx:Array>
  34.  
  35.     <mx:ApplicationControlBar dock="true">
  36.         <mx:Form styleName="plain">
  37.             <mx:FormItem label="Button enabled:">
  38.                 <mx:CheckBox id="ch1"
  39.                         selected="true"
  40.                         click="toggleButton(0, ch1.selected);" />
  41.             </mx:FormItem>
  42.             <mx:FormItem label="ButtonBar enabled:">
  43.                 <mx:CheckBox id="ch2"
  44.                         selected="true"
  45.                         click="toggleButton(1, ch2.selected);" />
  46.             </mx:FormItem>
  47.             <mx:FormItem label="ColorPicker enabled:">
  48.                 <mx:CheckBox id="ch3"
  49.                         selected="true"
  50.                         click="toggleButton(2, ch3.selected);" />
  51.             </mx:FormItem>
  52.             <mx:FormItem label="ComboBox enabled:">
  53.                 <mx:CheckBox id="ch4"
  54.                         selected="true"
  55.                         click="toggleButton(3, ch4.selected);" />
  56.             </mx:FormItem>
  57.         </mx:Form>
  58.     </mx:ApplicationControlBar>
  59.  
  60.     <mx:ButtonBar id="buttonBar"
  61.             dataProvider="{arr}"
  62.             itemClick="lbl.text = event.label;" />
  63.  
  64.     <mx:Label id="lbl" />
  65.  
  66. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: ButtonBar | No Comments » | 1,137 views Tags: , ,

Search Posts