Wie ExtJS Form Panel bodyPadding nicht Klotzen Form Tasten

Question

ich die extjs lesen offical tutorial ein Login-Formular zu erstellen, so dass ich folgende Login-Formular Fenster erstellen:

Ext.define('MyApp.view.login.Login', { 
    extend: 'Ext.window.Window', 
    xtype: 'login', 

    requires: [ 
     'Ext.form.Panel', 
     'Ext.form.field.Display', 
     'Ext.form.field.Text' 
    ], 

    bodyPadding: 10, 
    title: 'Login Window', 
    closable: false, 
    autoShow: true, 

    items: { 
     xtype: 'form', 
     reference: 'form', 
     items: [{ 
      xtype: 'textfield', 
      name: 'username', 
      fieldLabel: 'Username', 
      allowBlank: false 
     }, { 
      xtype: 'textfield', 
      name: 'password', 
      inputType: 'password', 
      fieldLabel: 'Password', 
      allowBlank: false 
     }, { 
      xtype: 'displayfield', 
      hideEmptyLabel: false, 
      value: 'Enter any non-blank password' 
     }], 
     buttons: [{ 
      text: 'Login', 
      formBind: true, 
      listeners: { 
       click: 'onLoginClick' 
      } 
     }] 
    } 
}); 

hier ist der Screenshot:

Bitte beachten Sie die Schaltfläche "Login", es wurde von einem grauen Hintergrund umwickelt, aber es war 10px weißen Raum mit Fenster padding.

Wie kann bodyPadding nicht die untere Schaltfläche ohne weißen Zwischenraum mit dem übergeordneten Fenster füllen? Just Like Bild folgenden:

Ich bin mit extjs6

Answer 1

die bodyPadding aus dem Fenster nach unten verschieben in das Formular. Der Körper enthält keine angedockten Objekte.

Fiddle.