PDA

View Full Version : question on a layout



marco76
24 Jan 2008, 8:33 AM
Hi
I have a question on a layout that I have to do.
I have a table with 3 columns and 2 rows
First colums have fixed width ang the other two I would filled the rest of a page and if I resize the page only these two last column resize.


var viewport = new Ext.Viewport({

layout:'table',
autoScroll:true,
title:'',
layoutConfig: {columns:3},
margins:'0 0 0 0',
items:[
{
colspan:1,
border:false,
width:200,
contentEl: 'sitepal'
},
{
rowspan: 2,
colspan:1
width:<!---HOW?--->
},
{
rowspan: 2,
colspan:1
width:<!---HOW?--->
}
]
});



How can I set the config of the two last column to get this behaivour?
Thanks

catacaustic
24 Jan 2008, 2:08 PM
I think you'd be better off with a column layout. Something like
var viewport = new Ext.Viewport({
layout:'column',
autoScroll:true,
title:'',
margins:'0 0 0 0',
items:[
{
width:200,
contentEl: 'sitepal'
},
{
columnWidth: 0.5
},
{
columWidth: 0.5
}
]
});That sets up the first column as 200px wide, and the last two as 50% of the remaining space. I haven't tested the actions when it resizes, but it'd be pretty safe to assume that it will work the way you want it to. :)

marco76
25 Jan 2008, 1:59 AM
Ok thanks all perfetc
I have another question.
I change a bit this layout now I have:


var viewport = new Ext.Viewport({
layout:'border',
items:[{
region:'center',
layout:'column',
autoScroll:true,
title:'',
margins:'0 0 0 0',
items:[
{
width:200,
layout:'fit',
items:grid1
},
{
columnWidth: 0.5
},
{
columWidth: 0.5
}
]},{
region:'south',
layout.'fit',
items:grid2
}]);



Now when I load this layout I get grid1 and grid2 in the region south.
Why this?
Thanks

Condor
25 Jan 2008, 2:08 AM
Try to avoid all those extra panels.

Use:


var grid1 = new Ext.grid.GridPanel({
...
width: 200
});
var grid2 = new Ext.grid.GridPanel({
...
region: 'south'
});
var viewport = new Ext.Viewport({
layout: 'border',
items: [{
region: 'center',
layout: 'column',
margins: '0 0 0 0',
items: [grid1, {
columnWidth: 0.5
},{
columWidth: 0.5
}]
}, grid2]
});

marco76
25 Jan 2008, 2:24 AM
But I lost the layout:'fit' so I think that thet I lost the resizable grid

marco76
25 Jan 2008, 2:39 AM
I get the two gei in the correct position but when i resize the page the second grid is bad resized

Condor
25 Jan 2008, 2:41 AM
You can't have layout:'fit' inside a column layout. For that you'll need to use a border layout with grid2 in the west panel.

marco76
25 Jan 2008, 3:06 AM
And if i have to include a grid inside a panel of a column layout?
How can I do it?

Condor
25 Jan 2008, 3:10 AM
And if i have to include a grid inside a panel of a column layout?
How can I do it?

Set autoHeight:true, but you won't have any grid scrollbars then.

marco76
25 Jan 2008, 3:30 AM
Sorry but a layout like this (in attachment) with the central panel of the column layout with a grid inside how can I get it?

Condor
25 Jan 2008, 3:51 AM
You'll have to give your grid a fixed height and use a anchor layout with anchor:'100%' for full width.