国庆期间，做了不少基于 flex 的开发工作，对 flex 的布局容器有了进一步深入的理解，也找到不少非常棒的文章，分享到这里方便一下大家。

Form 表单布局

Form容器是Flex 表单中处于最外层的容器，负责控制表单的大小，以及布局，通常表单中都是垂直布局，并且靠左对齐的。这个容器可以包含FormHeading以及FormItem。举个简单的例子。

private function submitForm():void { // Handle the form submission. } ]]> MA NH RI USA UAE UAW

效果图：

Grid布局

Grid通过网格的方法来放置组件，其实是把组件作为横纵方向的一个单元来实现的。来创建一个Grid容器。创建每一行，但是这个标记必须是子标记。同样利用可以创建每一行中的单元组件，而且这个标记也必须为子标记。

如图：

Panel 容器

这个就比较简单了。Panel具有Canvas HBox VBox的所有功能,如果Panel的layout属性值为 absolute则Panel对子级元素的布局方式和Canvas一样当为 horizontal时则相当于 HBox 为vertical时则相当于VBox并且可以为 Panel指定标题.

效果如图：

TitelWindow容器

TitleWindow继承自Panel,与Panel相比,它只多了一个对象,那就是关闭按钮,通过 TitleWindow close事件触发该按钮的单击事件它并不会自动将TitleWindow本身关闭,而是通过我们为该事件所写的代码决定。

import mx.controls.Alert; private function closeEvent():void{ Alert.show("you click the close","close"); } ]]>

效果如图：

Title layout 容器

所有的Titel容器中的单元组件都是具有相同大小尺寸的。这与Grid容器明显不一样了。这样就会出现这种情况，比如拟定每一行放置3个组件，你刚好有7个组件，那么就会分成3行放置，这样的话，最后一行就只有组件了。Title容器就具有这个特点。

direction="horizontal" borderStyle="solid" paddingTop="10" paddingBottom="10" paddingRight="10" paddingLeft="10" verticalGap="15" horizontalGap="10">

效果如图：