PDA

View Full Version : How to display panel floated above custom layout.



earist
21 Sep 2011, 6:33 PM
Due to http://www.sencha.com/forum/showthread.php?146442-How-to-customize-border-layout

I have a question about this custom layout.

I want to display the panel floated above the layout when clicking a collapse Panel' s placeholder.

(When panel is minimized. it can be temporary restored by clicking on minimized bar. When panel is on unpinned state, it will automatically minimized when lost focus.)

http://www.sencha.com/forum/attachment.php?attachmentid=28045&d=1315973282


following code is example code for create custom collapse tool



this.westTabPanel = new Ext.tab.Panel( {
cls : 'extwesttabpanel',
activeTab : 0,
width : 250,
minWidth : 120,
split : true,
stateful : true,
collapsible : true,
floatable : true,
region : 'west',
id : 'west-tab-panel',
hideCollapseTool: true,
preventHeader: true,
listeners : {
afterrender: function(tabPanel) {
tabPanel.placeholder.comp = tabPanel;

var tabBar = tabPanel.down('tabbar');

tabBar.add(
{flex: 1, xtype: 'component'},
{
type: 'left',
xtype: 'tool',
id: 'westcollapseleft',
handler: function(tool) {
tabPanel.collapse();
}
}
);
}
}
,
placeholder: Ext.widget('toolbar', {
vertical: true,
items: [{
type: 'right',
xtype: 'tool',
id: 'westcollapseright',
handler: function(ev, el, toolbar) {
toolbar.comp.expand();
}
}]
})
});





How to do that?

Thanks.