在 EXTJS 4 中为表单布局设置自定义标签长度答案

【问题标题】：Setting a custom label length for form layout in EXTJS 4在 EXTJS 4 中为表单布局设置自定义标签长度
【发布时间】：2017-04-14 16:01:05
【问题描述】：

我希望文本字段/复选框的“fieldLabel：”属性在布局方面优先于 xtype。正如您在下面的屏幕截图中看到的那样，文本看起来被压扁了。

这是我认为的代码的sn-p：

bodyPadding: 30,
    xtype: 'fieldset',
    title: 'Account',
    margin: '10 10 10 10',

items: [{
      xtype: 'form',
      layout: 'form',

items: [{
          xtype: 'checkboxfield',
          fieldLabel: 'Has registered for gift aid:',
          name: 'giftAidFlag',
          margin: '0 0 8 0',
          listeners: {
            change: function(cb, checked) {
              Ext.getCmp('manageGiftAidPayers').setDisabled(!checked)
            }
          }
        }, {
          xtype: 'button',
          anchor: '100%',
          text: 'Manage gift aid payers...',
          style: "width : 495px;",
          margin: '10 0 8 0',
          disabled: true,
          id: 'manageGiftAidPayers'
        }]
      }]

因此，基本上，一旦选中该框，按钮就会启用。

我需要让文本看起来更专业一点，并在复选框出现之前跨越它的全宽 - 有什么想法吗？对列布局不感兴趣。这有可能吗？提前致谢。

【问题讨论】：

标签： extjs extjs4

【解决方案1】：

您正在复选框字段中寻找配置labelWidth。

xtype: 'fieldset',
title: 'My Fields',
items: [
    {
        xtype: 'checkboxfield',
        fieldLabel: 'Has registered for gift aid:',
        labelWidth: 250,
        boxLabel: 'Box Label'
    },
    {
        xtype: 'button',
        width: 495,
        text: 'MyButton'
    }
]

【讨论】：