Question

ExtJs 中的tabPanel中如何加入gridPanel并且让它的宽高自适应求高手解答......

我自己写了gridPanel是放进去了但是报错...还不能宽高自适应高分求解......
并且想问一下
这是我的代码：
Ext.onReady(function() {
Ext.namespace('recordconsume');
recordconsume.testgreidPanel=new Ext.grid.GridPanel({
xtype:'gridpanel',
region:'center',
layout:'fit',
frame:false,border:true,
colModel:new Ext.grid.ColumnModel([
{header:'数据1',width:70,sortable:'true'},
{header:'数据2',width:70,sortable:'true'},
{header:'数据3',width:70,sortable:'true'},
{header:'数据4',width:70,sortable:'true'},
{header:'数据5',width:70,sortable:'true'}
]),
stripeRows:true,
view:new Ext.grid.GroupingView({
forceFit:false,
showGroupName:false,
enableNoGroups:false,enableGroupingMenu:false,
hideGroupedColumn:true
}),
viewConfig:{
forceFit:false
},
autoScorll:true
});

recordconsume.testPanel=new Ext.Panel({
layout:'border',
frame:false,
border:false,
items:[{
xtype:'tabpanel',frame:true,
margins:'0202',
region:'center',
activeTab:0,
items:[
{title:'消费信息管理',layout:'fit',region:'center',items:[recordconsume.testgreidPanel]}]
}]
});

new Ext.Viewport({
//layout:'border',
//region:'center',
frame:false, plain:true,
border:false,
items:recordconsume.testPanel
})

});

Answer 1

首先 你可能页面布局还是没弄懂
Viewport 可以放很多东西，包括panel
然后你再往panel里面放东西，你要放的是tabpanel
tabpanel里面可以放grid 还有其他的东西
但不管你怎么放，他们的布局方式都是border。
Viewport 里面放一个panel 例如在中间，那么他的panel里面就应该有region : 'center'，并且Viewport 里面layout : 'border'必不可少。
再往下推：
panel里面放一个tabpanel，这个tabpanel上面有一个grid下面有一个tool工具栏，
那么panel里面也必不可少layout : 'border'。那么里面的grid，还有tool工具栏指定他们的region就可以了
自适应问题你不用管，你只需要指定他们的位置，他们会自动适应。
如果你弄懂了layout:'border'这种排版方式，就不会出现宽高自适应的问题