Richten Sie Elemente vertikal in einem center - Sencha-Panel

Ich versuche, richten Sie die Mitte des Bildschirm von einem Artikel einfach eine label aber es ist, richten Sie es horizontal nicht vertikal.

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

Habe ich entfernt flex, und legen Sie height als gut, aber es funktioniert nicht. Bitte geben Sie mir irgendeinen Anhaltspunkt?

InformationsquelleAutor sohail.hussain.dyn | 2013-11-22
  1. 9

    Versuchen Sie es mit pack: center im layout, wie dieses:

    var panel = new Ext.Panel({
    layout: {
        type: 'hbox',
        align: 'center',
        pack: 'center'
    }, 
    items:[
        {
            xtype: 'label',
            html: 'My Label'
        }
    ]
});
    • Danke. Es funktioniert, aber was ist der Zweck der pack?
    • Es bestimmt, wie die untergeordneten Elemente des Containers sind zusammen verpackt. Wie center macht das Kind Gegenstände zusammen verpackt in der Mitte-Breite der container.
    • dies funktioniert nicht für mein panel. Ich habe als Elemente ein label und ein button
    InformationsquelleAutor Sujata Chanda
  2. 3

    Für HBox layout besser zu nutzen 'align: middle' config nehme ich an.
    Versuchen Sie dies:

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