Настройка пользовательской длины ярлыка для макета формы в EXTJS 4

Question

Я ищу, чтобы получить свойство «fieldLabel:» текстового поля/флажок, чтобы иметь приоритет над xtype с точки зрения макета. Как вы можете видеть на скриншоте ниже, текст выглядит скрюченным.

Here's what it looks like at the moment. http://i68.tinypic.com/hv3ol5.png

Вот фрагмент кода из моего зрения:

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' 
     }] 
     }] 

Таким образом, по существу, кнопка позволяет сразу коробка помечена.

Мне нужно, чтобы это выглядело немного более профессиональным с учетом приоритета текста и охвата его полной ширины перед появлением флажка - любые идеи? Не интересуется расположением столбцов. Это будет возможно? Заранее спасибо.

Answer 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' 
    } 
]