PDA

View Full Version : Collapsing a region



bossong
30 Jul 2009, 10:03 AM
Can we control the direction of a collapse? I have a nested layout ...

1) The viewport has a west and a center.
2) The center region contains a center and a south regions.

When I collapse this south region, it collapses upwards. I want it to collapse downwards, making the center region in item #2 display the height of the page.

Any thoughts?

Condor
30 Jul 2009, 1:55 PM
The south region should always collapse down.

Are you sure your layout is correct? Could you post it?

bossong
31 Jul 2009, 5:28 AM
Thanks for the reply Condor. Here's my layout ...


Ext.onReady(function() {
new Ext.Viewport({
layout:'border',
items:[
{
region:'west',
title:'Search By',
xtype:"treepanel",
width:200,
split:true,
collapsible:true,
collapseMode:"mini",
root:new Ext.tree.AsyncTreeNode({
expanded:true,
children:mainMenu
}),
rootVisible:false, // makes the root "invisible"
listeners:{
click:function(n) {
Ext.fly(n.getUI().getTextEl()).highlight();
},
}
},
{
region:'center',
border:false,
defaults:{ bodyStyle:"padding:5px" },
items:[
{
id:'narrowSearch',
region:'center',
title:'Narrow the Search',
split:true,
collapsible:true,
collapseMode:"mini",
bodyStyle:'height:40%',
autoScroll:true,
items:[grid]
},{
id:'deal',
region:'south',
title:'Deal',
layout:'border',
autoScroll:true,
split:true,
bodyStyle:'height:60%',
collapsible:true, // NOT COLLAPSING DOWN ??????
collapseMode:"mini",
items:[
{
region:'center',
layout:'border',
title:'Purchase Order',
buttonAlign:'center',
items:[
{
region:'center',
items:[lotTabs,btnSave,btnClear,btnCancel,btnSubmit]
},{
region:'north',
split:true,
height:100,
width:'fit',
labelAlign:'right',
layout:'column',
items:[poHead]
}
],
},{
id:'lots',
region:'west',
title:'Lots',
split:true,
collapsible:true,
width:150,
margins:'0 0 0 0',
html:lotList,
items:[btnAddLot]
}
],
},
],
},
],
});
});

Condor
31 Jul 2009, 5:36 AM
There is so much wrong with this layout that I don't know where to start...

1. Lots of overnesting.
2. Containers without a layout.
3. North/south regions need a height, east/west regions a width.
4. Lots of invalid config options.
...