PDA

View Full Version : Layout Problem - Hbox!



Jack9
18 Jun 2011, 1:18 PM
How can I get the "test" panel (defined at the bottom) to follow the vbox layout and appear below the column boxes?


new Ext.Panel({
layout:'vbox',
items:[
new Ext.Panel({
id:'cols'
,layout:'hbox'
,items:[
{flex:1}
,new Ext.Panel({
id:'leftp'
,flex:25
,defaults:{
value:'||||||||||||||'
,disabled:true
,label:'XXX'
,labelAlign:'right'
,xtype:'textfield'
}
,items:[{},{},{},{}]
})
,{flex:1}
,new Ext.Panel({
id:'rightp'
,flex:25
,defaults:{
value:'||||||||||||||'
,disabled:true
,label:'XXX'
,labelAlign:'right'
,xtype:'textfield'
}
,items:[{},{},{},{}]
})
,{flex:1}
]
})
,new Ext.Panel({
html:'test'
})
]
});

21 Jun 2011, 6:05 AM
Jack,

just some words of advice:

- Use xtypes. don't directly instantiate componetns.
- Stick with one way of comma management.
- Don't use static component IDs
- you should use defaultType instead of 'xtype' in the defaults object
- Consider using objects instead of strings for your layout, as you can set align and pack configuration options.

Jack9
21 Jun 2011, 1:29 PM
That wasn't very helpful :p

- Use xtypes. don't directly instantiate componetns.

I use xtypes where there isn't a lot of configuration needed. Most of the time, xtypes cause more problems than they solve for all levels of expertise. In the very few instances where you are duplicating a number of objects without a factory or simple loop, I can see a cause.

- Stick with one way of comma management.

My editor doesn't care. My proof of concept is a heavily modified/simplified version of other disparate code. Sorry if it is an inconvenience.

- Don't use static component IDs

For the purposes of this proof of concept, it's handy for reference.

- you should use defaultType instead of 'xtype' in the defaults object

Thank you for the tip.

- Consider using objects instead of strings for your layout, as you can set align and pack configuration options.

So wait, for complex class objects you want to simplify configuration with a string (xtype), but for simple layouts, you want to expand the configuration to specify the defaults? I don't understand the thinking.

I still don't understand the underlying problem of why the hbox layout is being ignored by the (outer) vbox layout.