Flex中如何设置TabNavigator容器中Tab对齐方式的例子

By Minidxer | September 2, 2008

接下来的例子演示了Flex中如何设置TabNavigator容器中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:Array id="arr">
  8.         <mx:Object label="left" />
  9.         <mx:Object label="center" />
  10.         <mx:Object label="right" />
  11.     </mx:Array>
  12.  
  13.     <mx:ApplicationControlBar dock="true">
  14.         <mx:Label text="horizontalAlign:" />
  15.         <mx:ComboBox id="comboBox"
  16.                 dataProvider="{arr}" />
  17.     </mx:ApplicationControlBar>
  18.  
  19.     <mx:TabNavigator id="tabNavigator"
  20.             width="100%"
  21.             height="100%"
  22.             horizontalAlign="{comboBox.selectedItem.label}">
  23.  
  24.         <mx:VBox label="Tab 1">
  25.             <mx:Label text="The quick brown fox..." />
  26.         </mx:VBox>
  27.  
  28.         <mx:VBox label="Tab 2">
  29.             <mx:Label text="The quick brown fox..." />
  30.         </mx:VBox>
  31.  
  32.         <mx:VBox label="Tab 3">
  33.             <mx:Label text="The quick brown fox..." />
  34.         </mx:VBox>
  35.  
  36.     </mx:TabNavigator>
  37.  
  38. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: Flex | No Comments » | Tags: , ,

Search Posts