ExtJS3.0的各种布局方式

ExtJs3 中的布局方法是采用 Ext.Container 类中的 Layout 属性去实现的，给 Layout 属性指定一个布局委托类去渲染容器内的子元素的展示。

Ext.layout 包内提供了 14 种不同的布局类，专用布局类 2 种，通用的布局类 12 种：

layout 值	布局类	说明
auto	Ext.layout.ContainerLayout	所有布局类的基类， layout 的默认值
absolute	Ext.layout.AbsoluteLayout	绝对定位布局
accordion	Ext.layout.AccordionLayout	手风琴布局
anchor	Ext.layout.Anchorlayout	定位式布局
border	Ext.layout.BorderLayout	边界式布局
card	Ext.layout.CardLayout	卡片式布局，标签和向导两种
column	Ext.layout.ColumnLayout	列布局
fit	Ext.layout.FitLayout	填充式布局
form	Ext.layout.FormLayout	表单布局
table	Ext.layout.TableLayout	表格布局
hbox	Ext.layout.HboxLayout	纵向切分布局
vbox	Ext.layout.VBoxLayout	横向切分布局
toolbar	Ext.layout.ToolbarLayout	工具栏布局，仅用于工具栏组件 (Ext.Toolbar)
menu	Ext.layout.MenuLayout	菜单布局，仅用于菜单组件 (Ext.menu.Menu)

Absolute绝对定位布局，通过定位子元素在容器内部的坐标决定子元素的位置

Accordion手风琴布局，收缩式的类似菜单样式，包含多个面板，只显示其中一个

Anchor定位式布局，相对于容器四周的尺寸大小，对其包含在内的元素进行定位

Border边界式布局，一种多面板，面向应用程序UI的布局风格，可支持多个套嵌面板，各区域间自动分隔和扩展/收缩功能。

Card标签式布局，包含的多个面板，里面的每个面板都会填充整个容器，而在同一时候只有一个面板是被显示的。比较常见的应用场合是Wizards（向导式对话框）、Tab标签页这些的实现等等。

Column列式布局，构建多个垂直式结构而准备的布局，当中包含已指定宽度的多个列，列的宽度可以是固定值，也可以是可伸缩的百分比宽度，但里面的内容就是自适应高度了。

Fit填充式布局，单个项布局的基类，这种布局会在容器上自动铺开以填充整个容器。

Form表单式布局，用来创建一个表单的布局，负责渲染和其部件内的子元件。

Table表格式布局，这种布局可以让你把内容轻易地渲染到一个HTML表格。可指定列的总数，而属性：跨行（rowspan）与跨列（colspan）就用于创建表格复杂的布局。

HBox纵向切分布局

VBox横向切分布局