日期:2014-05-16  浏览次数:20373 次

extjs4.0——布局介绍

Extjs4.0的布局介绍:

1:Fit布局

子元素会自动填满整个父容器。注意在其布局下,对子元素设置宽带是无效的。如果在Fit布局中放置多个组件,智慧显示第一个元素。

最典型的用处也就是在一个window或panel中放置一个grid组件,让grid组件大小会随着父容器的大小而改变。

2:border布局

本人觉得大体的框架布局都用它来布局

border布局也成为边界布局,他将页面分割为五个部分:west,east,south,north,center,而他们给参赛region赋值就可以了

north,south只能设置高度,west,east只能设置宽度

center自动变化

参数:spit:true可以手动调整四个区域的大小。

参数:collapsible:true 将激活折叠功能,这时title必须设置,因为折叠按钮时出现在标题部分的。

注意:center部分是必须使用的,而center区域是不允许折叠的。center会自动填充其他区域。无center是会报错。

3:Accordion布局

according布局也称手风琴布局,在accordion布局下,在任何时间里,只有一个面板处于激活状态。

其中每个页面都支持展开和折叠。

注意:只有Ext.Panels和所有Ext.panel.Panel子项才可以使用accordion布局

4:Card布局

这种布局用来管理多个子组件,并且任何时刻只能显示一个子组件,这种布局最常用的情况就是向导模式,也就是我们所说的分布提交。

5:Anchor布局

anchor布局是组件固定于父容器的某一个位置,使用anchor布局的子组件尺寸相对于容器的尺寸,即父容器的大小变化时,使用anchor布局的组件会根据规定的规则重新渲染位置和大小

6:AnchorLayout布局

7:Absolute布局

8:Column布局