Flex页面布局（容器类和导航类)

Flex超炫的视觉效果，相信很多人都为之震撼。因此页面布局就就成为程序开发中重要的一个环节。它直接决定了程序的成败。

刚开始学习这一块儿的时候，在脑中闪现出以前学习Swing时郁闷的场景。呵呵，这次让我们换一种学习方法，用实例来学习，这样不会空洞的只剩下长篇的理论，也不会枯燥的让我们想睡觉。

1）ApplicationControlBar

对于ApplicationControlBar，我们需要注意的是dock这个属性。

Dock是决定ApplicationControlBar的位置，默认为false。

当dock=true，ApplicationControlBar将始终显示在窗口的顶部，并且自动缩放，适应窗口大小。

当dock=false，它的位置可以随意设定。



1<?xml version="1.0" encoding="utf-8"?>
2<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" fontSize="12">
3    <mx:ApplicationControlBar dock="true">
4        <mx:Label text="dock=true"/>
5        <mx:MenuBar labelField="@label">
6            <mx:XMLList>
7                <item label="Country Name">
8                    <node label = "China"/>                   
9                    <node label = "America"/>                   
10                </item>
11                <item label="City Name">
12                    <node label = "BeiJing"/>                   
13                    <node label = "QingDao"/>                   
14                </item>
15            </mx:XMLList>
16        </mx:MenuBar>       
17    </mx:ApplicationControlBar>   
18    <mx:Label text="这个ApplicationControlBar的dock属性设置成了true，所以它永远显示在窗口的最顶端" y="10"/>   
19    <mx:ApplicationControlBar x="66" y="111" width="322">
20        <mx:Label text="dock=false"/>   
21    </mx:ApplicationControlBar>
22    <mx:Label text="默认的情况下dock的属性值为false，所以它可以出现在程序的任何地方" y="152" x="10"/>
23</mx:Application>