Toolbars and button alignment

[toxkillfraex]

Aligning stuff in a toolbar left right and center is no problem, but now I'm looking for a way to combine alignments.

I.e. I'm looking to have a first set of buttons centered in the middle and then a couple more aligned to the right.

can anybody help me on this one?

[tvanzoelen]

You could try to use the fill http://docs.sencha.com/ext-js/4-0/#!...t.toolbar.Fill to align to the right

[toxkillfraex]

You could try to use the fill http://docs.sencha.com/ext-js/4-0/#!/api/Ext.toolbar.Fill to align to the right

I was like EUREKA at first, but it only seems to do half of what I want when I set pack to start and I don't need buttons at the start. =/
center and end.

Or am I missing a setting on the fill item?

[tvanzoelen]

Just start with a fill

Ext.onReady(function() {

Ext.create('Ext.toolbar.Toolbar', {
    renderTo: document.body,
    width: 500,
    items: [
        '->',
        {
            // xtype: 'button', // default for Toolbars
            text: 'Button'
        },
        {
            xtype: 'splitbutton',
            text: 'Split Button'
        },
    // begin using the right-justified button container
        '->', // same as { xtype: 'tbfill' }
        {
        xtype: 'textfield',
        name: 'field1',
        emptyText: 'enter search term'
        }
    ]
});
  
  
            });

[toxkillfraex]

Just start with a fill

Ext.onReady(function() {

Ext.create('Ext.toolbar.Toolbar', {
    renderTo: document.body,
    width: 500,
    items: [
        '->',
        {
            // xtype: 'button', // default for Toolbars
            text: 'Button'
        },
        {
            xtype: 'splitbutton',
            text: 'Split Button'
        },
    // begin using the right-justified button container
        '->', // same as { xtype: 'tbfill' }
        {
        xtype: 'textfield',
        name: 'field1',
        emptyText: 'enter search term'
        }
    ]
});
  
  
            });

ah yes...

it looks beautiful =3

thanks!