EXT的formpanel中的横向排列布局

?利用formpanel的form和column属性混合使用来实现横线布局，效果图如下：

?

?

?

var hform = new Ext.form.FormPanel({title : "灵活布局的表单",width : 650,autoHeight : true,frame : true,renderTo : Ext.getBody(),layout : "form", // 整个大的表单是form布局labelWidth : 65,labelAlign : "right",items : [{ // 行1layout : "column", // 从左往右的布局items : [{columnWidth : .3, // 该列有整行中所占百分比layout : "form", // 从上往下的布局items : [{xtype : "textfield",fieldLabel : "姓",width : 120}]}, {columnWidth : .3,layout : "form",items : [{xtype : "textfield",fieldLabel : "名",width : 120}]}, {columnWidth : .3,layout : "form",items : [{xtype : "textfield",fieldLabel : "英文名",width : 120}]}]}, {// 行2layout : "column",items : [{columnWidth : .46,layout : "form",items : [{xtype : "textfield",fieldLabel : "座右铭1",width : 200}]}, {columnWidth : .46,layout : "form",items : [{xtype : "textfield",fieldLabel : "座右铭2",width : 200}]}]}, {// 行3layout : "form",items : [{xtype : "textfield",fieldLabel : "奖励",width : 500}, {xtype : "textfield",fieldLabel : "处罚",width : 500}]}, {// 行4layout : "column",items : [{layout : "form",columnWidth : 0.2,items : [{xtype : "textfield",fieldLabel : "电影最爱",width : 50}]}, {layout : "form",columnWidth : 0.2,items : [{xtype : "textfield",fieldLabel : "音乐最爱",width : 50}]}, {layout : "form",columnWidth : 0.2,items : [{xtype : "textfield",fieldLabel : "明星最爱",width : 50}]}, {layout : "form",columnWidth : 0.2,items : [{xtype : "textfield",fieldLabel : "运动最爱",width : 50}]}]}],buttonAlign : "center",buttons : [{text : "提交"}, {text : "重置"}]});

??

?