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

时间:2012-08-09 07:42:22

标签: sencha-touch extjs

我正在使用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'
        }  
        ]

    }

});

1 个答案:

答案 0 :(得分:1)

试试:

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

将容器放在您想要的位置,请参阅setPosition(..)方法: http://docs.sencha.com/ext-js/4-0/source/Component3.html#Ext-Component-method-setPosition