PDA

View Full Version : Toolbars and button alignment



toxkillfraex
15 Mar 2012, 1:14 AM
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
15 Mar 2012, 1:20 AM
You could try to use the fill http://docs.sencha.com/ext-js/4-0/#!/api/Ext.toolbar.Fill to align to the right

toxkillfraex
15 Mar 2012, 1:50 AM
You could try to use the fill http://docs.sencha.com/ext-js/4-0/#!/api/Ext.toolbar.Fill (http://docs.sencha.com/ext-js/4-0/#%21/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
15 Mar 2012, 2:01 AM
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
15 Mar 2012, 2:03 AM
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!