新手: 新建一个 tabpanel 怎么让其随里面的内容自动适应高度 大家帮忙看看 谢谢了
var tabsDemo=new Ext.TabPanel({
renderTo:Ext.getBody(),
width:700,
height: 300,
activeTab:0,
frame:true,
items:[
{
contentEl:"tabOne",
title:"自由选择"
},
{
contentEl:"tabTwo",
title:"分组选择"
}
]
});
jsp:
</div>
<div id="tabTwo" class="x-hide-display">
<div id="items2" class="demo-ct"></div>
</div>
TabPanel使用的是CardLayout,它会将当前激活的子组件设置为和父容器可视范围一样大。
这个行为是避免不了的,但你可以让子组件不受高度控制:
autoHeight:true
但只是这样的话TabPanel自身的高度还在,可以同样配置autoHeight属性
Sample:
[code="js"]
Ext.getBody().update();
var tabsDemo=new Ext.TabPanel({
renderTo:Ext.getBody(),
width:700,
height: 300,
activeTab:0,
frame:true,
autoHeight:true,
items:[
{
title:"自由选择",
html : "asdfasfas",
autoHeight:true
},
{
title:"分组选择",
html : "asdfasfas<br>asjdpfojpoasdf",
autoHeight:true
}
]
});
[/code]
PS:autoHeight的作用是让任何设置在组件上的高度都无效化,使其自己适应。
设置tabOne css width:100%;height:100%
把你tabpanel的height去了就可以了
你吧自由选择 添加滚动条,在设置tabOne的边框就能看到效果了。
你的tabOne和tabTwo有高度么?