sencha-touch - 如何使用 Sencha Touch 在屏幕中央对齐

Question

我正在使用 Sencha Touch，目前我正在向视图中添加一些 HTML 代码并在按钮下方。我希望 HTML 代码的内容与按钮一起位于屏幕的中心。

你能建议我怎么做吗？谢谢你的时间

Ext.define('Project.view.SettingsSuccess', {
    extend: 'Ext.Panel',
    xtype: 'settingformsuccess',

    config: {
        title: 'Settings',
        iconCls: 'info',
        cls: 'settings-success',
        scrollable: true,
        styleHtmlContent: true,

        items: [
        {
            xtype: 'titlebar',
            docked: 'top',
            title: 'Settings',

            items: [                
            {
                xtype: 'spacer'
            }, 
            {
                text: 'Back',
                ui: 'back'
            }
            ]
        },

        {
            html: [
            '<p>You have successfully authorised.</p>'
            ].join("")
        },

        // Go to Dashboard Button
        {
            xtype:'button',
            text: 'Visit your Home Page',
            ui: 'normal'
        }  
        ]

    }

});

Answer 1

试试看：

将 Html 内容和按钮打包到一个容器中： http: //docs.sencha.com/ext-js/4-0/#/api/Ext.container.Container

将Container放在你想要的地方，见setPosition(..)方法： http ://docs.sencha.com/ext-js/4-0/source/Component3.html#Ext-Component-method-setPosition