Ext.form.Panel，Ext 5，对齐标签和字段

Question

我正在使用Ext.form.Panel，它的配置如下：

defaultType : 'textfield',
layout      : 'auto',
height      : '60%',
width       : '40%',
floating    : true,
modal       : true,
renderTo    : Ext.getBody(),
closeAction : 'destroy', // default; invoked via the .close() method

在此表单中，我有许多textfield类型组件，每个组件都有相应的标签。超出标签和名称的配置是相同的，如下所示：

 fieldLabel : 'Dimension Label',
 name       : 'dimensionLabel',
 labelWidth : '400px', // to exagerate the label size
 padding    : '10px'

我想对齐输入字段，不一定是标签（如this question中有关.Net框架所示）;但是，我的输入字段是对齐的，如下所示：

一些SO帖子建议labelAlign的{​​{1}}配置;但是，它不是Ext JS 5中FormPanel的可用配置（我不知道它以前何时可用）。如果我尝试配置它，则忽略配置。我在现场和面板级别都试过了。

是否可以对齐左侧的上述字段？ Sencha论坛上的其他人建议使用Ext.form.Panel;但是，这也没有上述配置。

Answer 1

您可以使用form布局：

  

这是一个将呈现表单字段的布局，一个在另一个下面全部拉伸到容器宽度。

参见工作示例：https://fiddle.sencha.com/#fiddle/ls5

或者，您可以使用anchor布局：

  

这是一种布局，可以根据容器的尺寸锚定所包含的元素。

参见工作示例：https://fiddle.sencha.com/#fiddle/ls7