横向: 整个Radio Group使用column方式进行布局即可横向显示,但这样的话只能显示每一个Radio的BoxLabel,不能为Radio Group指定一个总的Label,所以第一个Radio再使用form布局进行嵌套,用它的fieldLabel作为Radio Group的Label.
纵向: 使用Form进行布局即可,但除了第一项之外的所有项需要把labelSeparator指定为空,以免出现多余的冒号
new Ext.FormPanel({
labelAlign: 'right',
frame:true,
title: 'Radio Group',
bodyStyle:'padding:5px 5px 0',
width: 400,
items: [{
layout:'column',//列布局
items:[{
layout: 'form',
items: [
new Ext.form.Radio({
fieldLabel: '横向Radio Group',
boxLabel:'opt1',
name:'opt1'
})]
},{
items: [
new Ext.form.Radio({
boxLabel:'opt2',
name:'opt1'
})]
},{
items: [
new Ext.form.Radio({
boxLabel:'opt3',
name:'opt1'
})]
},{
items: [
new Ext.form.Radio({
boxLabel:'opt3',
name:'opt1'
})]
}]
},{
layout: 'form',
items: [
new Ext.form.Radio({
fieldLabel: '纵向Radio Group',
boxLabel:'opt1',
name:'opt2'
}),
new Ext.form.Radio({
boxLabel:'opt2',
labelSeparator:'',
name:'opt2'
}),
new Ext.form.Radio({
boxLabel:'opt3',
labelSeparator:'',
name:'opt2'
}),
new Ext.form.Radio({
boxLabel:'opt3',
labelSeparator:'',
name:'opt2'
})
]
}]
});

