How to align buttons to left and right on toolbar in sencha touch?

Question

I have tried the following with no success:

items:[myapp.buttons.resultsPrevious, {xtype: 'spacer'}, myapp.buttons.resultsNext]

items:[myapp.buttons.resultsPrevious, '->', myapp.buttons.resultsNext]

Where items are the items of the relevant toolbar.

And I have also tried to use the align property of the buttons:

align: 'left'

in the configuration for the buttons, but that doesn't work either.

Any tips appreciated. Thanks.

Answer 1

The toolbar must have the layout property configured:

layout: {
  pack: 'left'
},

Answer 2

Then we have to use docked property for aligning the button right or left.

xtype: 'toolbar',
        docked: 'bottom',           
        items:
        [
            {
                 xtype: 'button',
                 id:'btn1',
                 html:"left btn",
                 docked: 'left'                  
            },
            {
                 xtype: 'button',
                 id:'btn2',
                 html:'right btn,
                 docked: 'right'                  
            }

        ]