PDA

View Full Version : simple horizontal split on viewport layout



dirtdevil
27 Aug 2009, 12:12 PM
For the life of me I can't seem to figure out how to do a simple horizontal split in my center panel on my viewport. I've done this a million times before and I've even mixed and matched code snipets from the samples but I can't figure it out. Heres my code... it's pretty small.


var viewport = new Ext.Viewport({

layout:'border',
defaults: {
collapsible: true,
split: true,
bodyStyle: 'padding:15px'
},
items: [{
title: 'Footer',
region: 'south',
height: 150,
minSize: 75,
maxSize: 250,
cmargins: '5 0 0 0'
},{
title: 'Navigation',
region:'west',
margins: '5 0 0 0',
cmargins: '5 5 0 0',
width: 175,
minSize: 100,
maxSize: 250
},{
layout: 'border',
region:'center',
border: false,
split:true,
margins: '2 0 5 5',
width: 275,
minSize: 100,
maxSize: 500,
items: [{
xtype: 'panel',
'html': '<b>this is a bold test</b>'
},{
xtype: 'panel',
'html': '<b>this is another bold test</b>'
}]
}]

});
});

Animal
27 Aug 2009, 12:15 PM
The two things still need configuring!

Which region are they to be?

How high is the non-center region to be?

split true or false, collapsible true or false, margins, cmargins etc etc.....

dirtdevil
27 Aug 2009, 12:29 PM
both of the sample "bold test" panels should be an even size and the horizontal split bar between them able to resize the two panels. God, this is so embarassing. I haven't touched extjs in months and I even went to the conf in orlando.

Animal
27 Aug 2009, 12:54 PM
both of the sample "bold test" panels should be an even size and the horizontal split bar between them able to resize the two panels.

You need to tell it all this info.