EXT3.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横向切分布局

文章出处：飞诺网(www.firnow.com):http://dev.firnow.com/course/4_webprogram/jsp/jsp_js/20100721/477625.html