CODEWITHSUNDEEP
sencha-touchextjs
GibboK
GibboK

Reputation: 74008

How to aligh in the centre of the screen with Sencha Touch

I'm using Sencha Touch, at the moment I'm adding to the view some HTML code and underneath a button. I would like have the content of the HTML code together with the button to be in the centre of the screen.

Could you suggest me how to do it? thanks for your time

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'
        }  
        ]

    }

});

Upvotes: 0

Views: 932

Answers (1)

Walter Fuchs
Walter Fuchs

Reputation: 175

Try that:

Pack the Html Content and the Button in a Container: http://docs.sencha.com/ext-js/4-0/#/api/Ext.container.Container

Place the Container where you want, see the setPosition(..) Method: http://docs.sencha.com/ext-js/4-0/source/Component3.html#Ext-Component-method-setPosition

Upvotes: 1

Related Questions