Sencha Touch TabBar add button on the left side of tabs

Question

I was working through some sencha touch tutorials and i can't figure out how to add a button to the left of tabs in TabPanel view. By default a button is added to the right of tabs. I have tried changing align and layout settings but nothing seems to be working. Here is the simple code that I'm trying to modify

Ext.setup({

onReady: function() {
    new Ext.TabPanel({
        fullscreen: true,

        tabBar:{
            items:[{
                xtype: 'button',
                ui: 'round', 
                text: 'Round'
            }]
        },

        items: [{
            title: 'Tab 1',
            html: '1',

        }, {
            title: 'Tab 2',
            html: '2',

        }, {
            title: 'Tab 3',
            html: '3',

        }]
    });
}

});

Answer 1

Try this:

tabBar:{
   dockedItems:[{
       xtype: 'button',
       ui: 'round', 
       text: 'Round',
       dock: 'left'
   }]
},