Extjs4 如何在EXtJS列布局中增加列空间

我设计了一个报名表，如图所示

我需要在测试框和中间名称标签之间有相同的空间

我的代码如下：

var patientForm = new Ext.FormPanel({
layout: 'column',
columnWidth:1.5,
renderTo: "patientCreation",
frame: true,
autoScroll:true,
title: 'Create Patient',
bodyStyle: 'padding:9px',           
width: 900,
items: [
{   xtype: 'textfield',
    fieldLabel: 'FirstName',
    name: 'firstName',
    vtype : 'alpha',
    allowBlank:false
},{
    xtype: 'textfield',
    fieldLabel: 'MiddleName',
    name: 'middleName',
    vtype : 'alpha'             
},{
    xtype: 'textfield',
    fieldLabel: 'LastName',
    name: 'lastName',
    vtype : 'alpha',
    allowBlank:false
},{
    xtype: 'textfield',
    fieldLabel: 'Email',
    name: 'email',
    vtype: 'email',
    allowBlank:false
},
....
....
]

---

如何在文本框和中间名列之间留出/增加空间？

如果您知道列数，请使用列布局。否则，请执行以下操作：

defaults: {
    labelStyle: 'padding-left:10px;'
},
items: [...]

---

将

默认值
配置添加到列的容器中。它的所有子项都将具有您在
默认值中定义的设置。在本例中，
defaults
中只有将应用于每个项目/列的
margin
设置（）

Ext.create('Ext.panel.Panel', {
  title: 'Column Layout - with default margins',
  width: 350,
  height: 250,
  layout:'column',
  defaults: {
    margin: '0 15 0 0' //top right bottom left (clockwise) margins of each item/column
  },
  items: [{
    title: 'Column 1',
    columnWidth: 0.25
  },{
    title: 'Column 2',
    columnWidth: 0.55
  },{
    title: 'Column 3',
    columnWidth: 0.20
  }],
  renderTo: Ext.getBody()
});

接受的解决方案仅适用于作为列的字段。我的解决方案适用于任何类型的列

注：专栏布局文档是。
您好，谢谢您的评论，效果很好。还有什么方法可以将所有标签都放在一行中吗？不客气。你把所有标签放在一行是什么意思？（在你的代码中？）如果你看到“紧急联系人”标签，它被分成两行，我想把它做成一行。你能详细说明一下如何使用“标签宽度”吗？我对ExtJsSure很陌生。执行此操作：默认值：{labelStyle:'…'，labelWidth:200}