PDA

View Full Version : proportionately resizing window



SunWuKung
23 Apr 2014, 2:40 AM
Is there a way to make a window resize proportionately?
Maybe in a similar manner to Ext.Resizable, preserveRatio: true
Many thanks.
SWK

Kachopsticks
29 Apr 2014, 12:20 PM
You should use the hbox or vbox layouts on your top component. Then the components that you want to have re size proportionately should have a flex value. So if you have two components and you want one to take up 2 thirds and the other to take up 1 third. Set componentA's flex to 2 and componentB's flex to 1. Then component A will always take up two thirds of the screen. If you want them half and half, set them both to one. In the example below, I have a grid and form that are both the same size and re-size proportionately (1 to 1)when the window size changes.


this.items = [
{
xtype: 'container',
layout: 'hbox',
height: 150,
items: [
{
flex: 1,
height: 150,
xtype: 'myForm'
},
{
flex: 1,
height: 150,
xtype: 'myGrid'
}
]
},