양식 패널을 화면 중앙에 놓습니다.

Question

양식 패널이 있으며 컨테이너처럼 작동합니다. 그럼 나는 텍스트 필드와 버튼을 추가하는 또 다른 폼 패널을 가지고있다. 이 양식 패널이 화면 중앙에 있어야합니다. 그리고 텍스트 상자의 단추 아래쪽 (양식에서 위치를 지정할 수 있어야합니다. 예 : Absolute 레이아웃).

내 코드는 다음과 같습니다. 내가 원하는 방식대로 작동하지 않습니다. 어떤 사람은 외부 용기에 다음과 같은 레이아웃을 사용하려면이

Ext.define('MyApp.view.MyView', { 
    extend: 'Ext.form.Panel', 
    alias: 'widget.myview', 
    frame: true, 
    height: 800, 
    hidden: false, 
    hideMode: 'visibility', 
    id: 'myviewid', 
    autoScroll: false, 
    bodyPadding: 5, 

    initComponent: function() { 
     var me = this; 

     Ext.applyIf(me, { 
      items: [{ 
       xtype: 'form', 
       height: 330, 
       width: 400, 
       layout: { 
        type: 'absolute' 
       }, 
       bodyPadding: 10, 
       title: 'Care Fusion User Login', 
       anchor: '250 250', 
       items: [{ 
        xtype: 'textfield', 
        id: 'name', 
        width: 233, 
        name: 'name', 
        fieldLabel: 'Nmae', 
        growMax: 200, 
        x: 10, 
        y: 30 
       } { 
        xtype: 'button', 
        height: 30, 
        width: 256, 
        text: 'Click', 
        x: 240, 
        y: 110 
       }] 
      }] 
     }); 

     me.callParent(arguments); 
    } 

}); 

Answer 1

시도로 볼 수 있습니다 :

layout: { 
    align: 'middle', 
    pack: 'center', 
    type: 'hbox' 
}, 

은 당신은 내부 형식이 외부 형태의 중앙에 배치됩니다.