ext-js中的容器和布局(介绍)

 什么是容器(Container)

Extjs被称为是最强大的前端组件库,组件,也就是Component,是可以复用的代码块,并且直接可以和浏览器配合形成最终外观。而容器,是一种特殊的组件,说白了就是用来包含其他组件的组件。而我们的extjs的应用是由若干的组件,以及组件的排列组合嵌套共同组成。

什么是容器布局(Layout):

因为容器是用包含其他组件的,所以容器肯定有一种机制来管理在其中的各个组件,包括它内部的各个组件的尺寸和位置,这时候,布局(Layout)就闪亮登场了

布局生效时间:

一旦设定好了值之后,当初始化组件时,extjs会自动调用容器的doLayout方法,这个方法的作用是计算出所有子组件的尺寸和位置,并且更新到DOM树。doLayout是一种递归调用机制,所以会层层计算直到最底部,一般开发时候程序员不用主动去调用,extjs框架会自动调用。

当我们对于组件进行了任何添加删除或者容器被resize的时候,会触发容器的redoLayout,从而重新计算各个组件的尺寸和位置。我们可以用suspendLayout方法+手动调用doLayout来阻止容器自动布局,而是我们自己来负责布局。

什么是组件布局:

如果是extjs自带的预定义组件,那么我们无需去担心布局问题,因为框架设计者已经为我们做好了一切,但是如果是自己定义的组件,那么我们需要给一个布局方式参数,用componentLayout,否则,它会自动的使用默认的auto的方式进行布局。

 

你可能感兴趣的:(layout,ExtJs,container)