ExtJS面板和布局类



1）Ext.panel.Panel 主要包括5部分：底部工具栏，顶部工具栏，面板头部，面板底部，面板体
对于面板最重要的功能和作用就是在其中显示各种不同来源的内容，extjs提供了4种不同的显示内容的方式，分别是：
1）使用autoLoad配置项为面板加载远程页面 就是远程加载html文件
2）使用contentEl配置项为面板加载本地资源 加载当前页面中的html代码
3）使用html配置项自定义面板内容 自己编写html代码
4）使用items配置项在面板中添加组件

2）标准布局类 主要包括如下11种：
auto（自动布局） checkboxgroup（复选框组布局） fit（自适应布局） column（列布局）
accordion（折叠布局）table(表格布局） card（卡片式布局） border（边框布局）
　　 anchor（锚点布局）　box（盒布局） absolute（绝对位置布局）
（1）auto自动布局 默认采用，使用原始的HTML文档流来布局子元素。
（2）fit自适应布局 使唯一的子元素充满容器
（3）accordion折叠布局 只有一个子面板处于打开状态，其他的收缩起来
（4）card卡片式布局 多个子面板，只有一个处于打开状态，其他的需要调用事件才能显示出来
（5）anchor锚点布局 根据容器大小为其所包含的子面板进行定位。
（6）absolute绝对定位 可以根据面板的位置配合x/y坐标进行定位
（7）checkboxgroup复选框组布局
（8）column列布局 多列风格的布局样式
（9）table表格布局 可以创建出复杂的表格布局
（10）border边框布局 将整个容器分为5个部分：东南西北中。
（11）box盒布局
在ext中，所有的布局都是从ext.container开始的
3）使用viewport
viewport代表整个浏览器窗口的显示区域，将document.body作为渲染对象，它会根据浏览器窗口的大小自动调整自身的尺寸，每个页面中只允许出现一个viewport实例。