在一箇中心垂直對齊項目 - Sencha面板

Question

我想對齊一個項目的屏幕中間只是一個label，但它是水平對齊而不是垂直。

var panel = new Ext.Panel({ 
    layout:{ 
     type: 'vbox', 
     align: 'center' 
    }, 
    items:[ 
     { 
      xtype: 'label', 
      html: 'My Label' 
     } 
    ], 
    fullscreen: true, 
    flex: 1 
}); 

我已刪除flex，並設置height爲好，但它不工作。請給我一些線索？

Answer 1

嘗試在佈局使用pack: center，像這樣：

var panel = new Ext.Panel({ 
    layout: { 
     type: 'hbox', 
     align: 'center', 
     pack: 'center' 
    }, 
    items:[ 
     { 
      xtype: 'label', 
      html: 'My Label' 
     } 
    ] 
}); 

Answer 2

對於HBox中的佈局最好使用「對齊：中間」的配置，我想。 試試這個：

var panel = new Ext.Panel({ 
    layout: { 
     type: 'hbox', 
     align: 'middle' 
    }, 
    items:[{ 
     xtype:'label', 
     html:'My Label' 
    }] 
});