Flex中如何控制TabBar控件特定Tab的状态为有效或者无效的例子

By Minidxer | August 8, 2008

接下来的例子演示了Flex中如何控制TabBar控件特定Tab的状态为有效或者无效。

让我们先来看一下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:ApplicationControlBar dock="true">
  8.         <mx:CheckBox id="tabBarEnabled"
  9.                 label="TabBar.enabled"
  10.                 selected="true"
  11.                 width="25%" />
  12.  
  13.         <mx:CheckBox id="tab1Enabled"
  14.                 label="Tab1.enabled"
  15.                 selected="true"
  16.                 width="25%" />
  17.  
  18.         <mx:CheckBox id="tab2Enabled"
  19.                 label="Tab2.enabled"
  20.                 selected="true"
  21.                 width="25%" />
  22.  
  23.         <mx:CheckBox id="tab3Enabled"
  24.                 label="Tab3.enabled"
  25.                 selected="true"
  26.                 width="25%" />
  27.     </mx:ApplicationControlBar>
  28.  
  29.     <mx:VBox verticalGap="0">
  30.         <mx:TabBar id="tabBar"
  31.                 width="400"
  32.                 dataProvider="{viewStack}"
  33.                 enabled="{tabBarEnabled.selected}" />
  34.  
  35.         <mx:ViewStack id="viewStack" width="400" height="100">
  36.             <mx:VBox id="tab1"
  37.                     label="Tab1"
  38.                     backgroundColor="haloGreen"
  39.                     enabled="{tab1Enabled.selected}">
  40.                 <mx:Label text="Label 1" />
  41.             </mx:VBox>
  42.  
  43.             <mx:VBox id="tab2"
  44.                     label="Tab2"
  45.                     backgroundColor="haloBlue"
  46.                     enabled="{tab2Enabled.selected}">
  47.                 <mx:Label text="Label 2" />
  48.             </mx:VBox>
  49.  
  50.             <mx:VBox id="tab3"
  51.                     label="Tab3"
  52.                     backgroundColor="haloOrange"
  53.                     enabled="{tab3Enabled.selected}">
  54.                 <mx:Label text="Label 3" />
  55.             </mx:VBox>
  56.         </mx:ViewStack>
  57.     </mx:VBox>
  58.  
  59. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Flex | Tags: , ,

Related Post

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll

Sponsored Ads