Thursday, July 21, 2011

Adding panel to ViewPort (ExtJS)

Add Panels to ViewPort on the fly

1) Define ViewPort

viewport = Ext.create('Ext.container.Viewport', {
layout: {
type: 'border'
},
defaults: {
split: false
},
items: [{

region: 'center',
layout: 'border',
frame: false,
padding: '0 5 0 0',
border: false,
items: [{
region: 'center',
items: [
{
xtype: 'grid1'
}

]
}]
},


{

region: 'south',
frame: false,
padding: '0 5 0 0',
border: false
}
]
});


2) Add panel on the fly to defined region. In our example we are adding panel to "South" region

southRegion = viewport.getComponent(1);

southRegion .add(myPanel);

southRegion .setWidth(200);

southRegion .doLayout();



No comments: