PDA

View Full Version : lost vertical gap between the panels in viewport



KSagar
4 Nov 2009, 3:53 AM
I am using view-port. I am trying to create new panels dynamically in view-port. After creation of these panels, I found that the vertical gap between the newly added panels is lost. Please help.

Animal
4 Nov 2009, 4:12 AM
What do you mean "lost"?

You have to ASK for margins

KSagar
4 Nov 2009, 4:22 AM
In my view-port, I have small horizontal gap between the view-port columns but there no gap between the two panels from the same column. It looks like these panel are stick to each other one above without a fraction of gap.

Where and how to specify margin?

Condor
4 Nov 2009, 4:31 AM
It depends on the layout. Which layout does the container of these 2 panels have?

KSagar
4 Nov 2009, 4:37 AM
My code for viewport is as,

var viewport = new Ext.Viewport({
layout:'border',
items:[{
xtype: 'tbbutton',
text: 'Configure Viewport',
handler: function()
{
configWindow.show();
}
},{
xtype:'portal',
id: 'portalmain',
region:'center',
margins:'35 5 5 0',
items:[{
columnWidth:.33,
id:'portal1',
style:'padding:10px 0 10px 10px'
},{
columnWidth:.33,
id:'portal2',
style:'padding:10px 0 10px 10px'
},{
columnWidth:.33,
id:'portal3',
style:'padding:10px'
}]
}]
});

Where I need to change?

I have edited already available portal sample from examples by extjs. I think portal coloumn layout is 'anchor'

Condor
4 Nov 2009, 5:55 AM
That should be:

var viewport = new Ext.Viewport({
layout: 'fit',
items: {
xtype: 'portal',
tbar: [{
text: 'Configure Viewport',
handler: function () {
configWindow.show();
}
}],
id: 'portalmain',
margins: '35 5 5 0',
items: [{
columnWidth: .33,
id: 'portal1',
style: 'padding:10px 0 10px 10px'
},{
columnWidth: .33,
id: 'portal2',
style: 'padding:10px 0 10px 10px'
},{
columnWidth: .33,
id: 'portal3',
style: 'padding:10px'
}]
}
});

KSagar
4 Nov 2009, 6:19 AM
It is not working. It is just making layout change for view port.

I think this problem is related to the layout of portal column.

Screen-shot is attached with this reply.

Condor
4 Nov 2009, 7:07 AM
Are you adding Panels? You should be adding Portlets!

ps. It doesn't need to be a Portlet, but in that case your panel should be configured with:

anchor : '100%',
frame : true,
collapsible : true,
draggable : true,
cls : 'x-portlet'

KSagar
4 Nov 2009, 10:27 PM
Hey...it helps. Now it is showing proper distance between the panels. =D>
Scrrenshot is attached.

Thanks Condor. :)