PDA

View Full Version : How to get Tabpanel AutoHeight?



ethraza
7 Jul 2007, 3:51 AM
I have a Borderlayout with north, south, east and center.
I'm creating a TabPanel inside the center and loading all my pages into dynamic tabs.

But when a tab is created and the content set, I can see a blue line that grows with the content height. That blue line is bottom of the tab.
How can I make that tab automatic fitTo the size of the center layout panel?
So that tab get a scroll bar if the content loaded inside it is bigger than the screen.

At the time I'm doing a dirty thing, so I can see it. I'm setting the tabpanel height via syncHeight to the height if the east panel + 23px. (centertabs.syncHeight(Ext.get('east').getHeight()+23);) But I think that exists a better solution to that.

Thanks!

ethraza
8 Jul 2007, 2:14 AM
I don't know if it is the best way, but with the help of FireBug and a entire night, I get it happens like this:
(specting it helps others)

// The container of centertabs div is the center div that is the container for center layout


var layout = new Ext.BorderLayout(...)
(...)
layout.add('center', new Ext.ContentPanel('center', 'Center'));
(...)

var centertabs = new Ext.TabPanel('centertabs', {
resizeTabs:true,
minTabWidth: 100
});
layout.on('layout',function(){centertabs.syncHeight(Ext.get(layout.regions.center.el).getHeight());}
);

addTab : function(sTitle,sContent,sParams,sId){
if (!sId) { sId = Ext.id() }
if (!Ext.get(sId)) {
var obj = centertabs.addTab(sId, sTitle, sContent, true);
obj.setUrl(sContent,sParams,true).loadScripts = true;
centertabs.syncHeight(Ext.get(layout.regions.center.el).getHeight());
obj.bodyEl.fitToParent(true,centertabs.bodyEl);
obj.activate();
return obj;
}else{
centertabs.activate(sId);
}
}
As you can see, now my tabs will get the right height with any content, including Grids, without the need of GridPanel, that will only need that I set a Ext.get('gridcontainer').fitToParent(true); on the grids container div.

I'm only curious about one thing...
There is a Ext shorthand way to get the 'layout.regions.center.el'?

ps. Now I'll go to sleep! ;D