首先,API上很明确讲了:
Ext.grid.GridPanel 写道
Notes:
1.Although this class inherits many configuration options from base classes, some of them (such as autoScroll, autoWidth, layout, items, etc) are not used by this class, and will have no effect.
---autowidth和autoheight是没用的
2.A grid requires a width in which to scroll its columns, and a height in which to scroll its rows. These dimensions can either be set explicitly through the height and width configuration options or implicitly set by using the grid as a child item of a Container which will have a layout manager provide the sizing of its child items (for example the Container of the Grid may specify layout:'fit').
我现在的做法:
1.在3.0RC2
中,如果一行有多个GRID,则使用Ext.layout.HBoxLayout,如下图和代码
相关代码:
var p = new Ext.Panel({
title:'::业务成功率(近4个统计周期)::',
region:'center',
//新的布局方式
layout:{
type:'hbox',
align : 'stretch',
pack : 'start'
},
defaults:{
//子元素平均分配宽度
flex:1
},
split:true,
frame:true,
//前面定义的一个Grid数组
items:this.businessGridArr,
tbar:toolbar
});
PS:如果几个Grid需要不同的宽度,则分布给他们设置flex,看源码即知,会把全部的flex总和后求百分比.
2.ExtJS3.0及以前版本
1)利用其他布局管理器,如把grid放到一个fit布局的panel中
2)设置一个高度,然后自己去维护它
如监听grid所在的panel的afterlayout事件,然后获取grid的ownct的高度,从而设置,但是要计算到工具条等占用的宽度。如下代码:
//控制缩放的时候修改grid的高度
this.on('afterlayout',function(view,layout){
var height = this.gridPanel.getSize().height - 30;
for(var i=0;i<this.gridArr.length;i++){
this.gridArr[i].grid.setHeight(height); //.doLayout()
}
},this);
PS:至于在border布局里面,有north,south,center三个panel, 中间的放置一个grid,
高度不会自适应,是因为border是先计算north和south,然后剩下的空间给center.
依稀记得在extjs论坛有人说过,这种情况下center里面的grid不能自适应宽度,是一个很难修复的bug.
涉及到浏览器问题。
- 大小: 137.5 KB
分享到:
相关推荐
ExtJS grid过滤操作,可以动态操作本地的store更改筛选的内容
这是利用sencha cmd 生成的GridFilterDemo工程中的app和build文件夹,其余文件过大并且与主题无关,因此未包含。具体方法,请参看我的博客: 《Extjs4.2 Grid Filter Feature 表格过滤特性》
ExtJs选中var editor = new Ext.ux.grid.RowEditor详解.txt
ExtJS基础教程..................
extjs-theme-bootstrap-master.zip
extjs&使用grid显示数据参照.pdf
ExtJS实用简明教程.rar..............
ExtJS对几种面向对象体现.txt ExtJS对几种面向对象体现.txt
Extjs框架基础.pptExtjs框架基础.ppt
Extjs4.0学习指南(中文).rar
extjs grid示例代码extjs grid示例代码extjs grid示例代码extjs grid示例代码
ExtJS入门教程(超级详细).pdf
extjs多选下拉框,Ext.ux.form.LovCombo,extjs 以修复多选下拉框火狐下取不到值的问题,火狐下div不显示背景色的问题
Extjs简单版酒店管理系统源码.Extjs简单版酒店管理系统源码.
js框架 extjs-4.2.1.883.7z
extjs实例也个个控件的使用.zip;extjs实例也个个控件的使用.zip
extjs grid 多表头 插件 extjs grid 多表头 插件
ExtJs Grid是否选择行,是:返回选择行record;否:返回false
extjs4Grid和jqGrid对比.doc
EXTJS grid导出EXCEL文件,源码可以直接导入MYECLIPSE使用,EXTJS版本3.2.0