Ext常用6大布局方式
只要是EXT.Container以及其之类都可以都可以使用Layout对其Items进行布局 
?
?
简单说明最常用到的6种布局方式：
一.最简单的布局：FitLayout
new Ext.Viewport({ layout:'fit', items:[oGrid] //oGrid是一个表格 });
?
?
?
?
?
注意：
1.使用Fit布局 items中只能有一个组件，如果你放置了多个组件，也只能是第一个用效。
2.使用Fit布局在组件中不能使用：autoHeight:true 否则会使FitLayout实效
二.最常用的布局：BorderLayout
?
?注意：
1.center属性值必须指定
2.north,south 不要指定width
3.west,east不要指定height
4.不要使用autoHeight，autoWidth
5.添加split:true属性可以控制区域大小
三.表单布局：FormLayout
?
?注意：
1.从上面的继承图可以看出FormLayout是AnchorLayout的子类，因此可以在里面使用anchor属性设置大小比例
2.FormLayout是FormPanel默认的布局方式，因此可以不显示写出Layout:'form'
3.fieldLabel，boxLabel在FormLayout布局情况下才能显示出来
四.列布局：ColumnLayout
?
new Ext.Viewport({ layout:'column', itmes:[{ title:'第一列', columnWidth:.3 //30% },{ title:'第二列', columnWidht:.3 //30% },{ title:'第三列', columnWidth:.4 //40% }] });?
?
?
?
?
?注意：
1.items的每个子组件中的columnWidth加起来的和必须为1
五.控制大小布局：AnchorLayout
?
六.伸缩折叠布局：Accordion
?
new Ext.Viewport({ layout:'border', items:[{ region:'west', width:200, layout:'accordion', //伸缩折叠布局 layoutConfig:{ titleCollapse:true, //单击标题可以折叠 animate:true, //展开折叠时的动画效果 activeOnTop:true,//展开的子面板的顺序总在最上面 }, items:[{ title:'第一栏', html:'one' },{ title:'第二栏', html:'two' },{ title:'第三栏', html:'three' },{ title:'第四栏', html:'four' }] },{ region:'center', split:true, border:true }] });?
?
?
?注意：
1.使用Accordion布局一定要设置标题：title
2.与布局有关(所有布局方式都可以)的参数属性都可以写在layoutConfig:{}里面 ； 
?
?
?
?
?2012.3.12增加??
??
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
