Ext.Viewport用了TabPanel
{ region:'center', layout:'fit', split:true, collapsible: true, margins:'0 0 0 0', frame:true, items:tabPanel }
Ext.TabPanel里建立一个新的Ext.TabPanel,包含GridPanel
var tabPanel = new Ext.TabPanel({ id:'tabPanel', region:'center', deferredRender:false, activeTab:0, enableTabScroll:true, defaults: {autoScroll:true}, items:[{ contentEl:'center_context_desktop', title: '桌面', autoScroll:true }] });
这里,试过好多方法,都无法把grid设置为自适应宽度,快发疯了.
tabPanel.add({ id: 'user_list_grid', title: '用户列表', iconCls: 'userIco', closable:true, items:grid })
刚通过以下方式试成功了.
使用这位仁兄的方法成功了.分享给大家
var grid = new Ext.grid.GridPanel({ //autoWidth:true, border:false, width: Ext.get('center_context_desktop').getWidth(), ds: new Ext.data.Store({ reader: new Ext.data.ArrayReader({}, [ {name: 'company'}, {name: 'price', type: 'float'}, {name: 'change', type: 'float'}, {name: 'pctChange', type: 'float'}, {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'} ]), data: Ext.grid.dummyData }), cm: new Ext.grid.ColumnModel([ new Ext.grid.RowNumberer(), {id:'company',header: "Company", width: 120, sortable: true, dataIndex: 'company'}, {header: "Price", width: 70, sortable: true, renderer: Ext.util.Format.usMoney, dataIndex: 'price'}, {header: "Change", width: 70, sortable: true, dataIndex: 'change'}, {header: "% Change", width: 70, sortable: true, dataIndex: 'pctChange'}, {header: "Last Updated", width: 95, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'} ]), viewConfig: { forceFit:true }, autoExpandColumn:'company' }); //autoWidth:true, 这一行一定要隐藏,在ie7和ff下试了,是没有问题的. 同时还有bodyStyle:'width:100%',这个也试成功了