PDA

View Full Version : extjs toolbar with multiple rows display items



javapurna
19 Apr 2013, 2:42 AM
how to display toolbar items in two rows .

slemmon
20 Apr 2013, 7:58 PM
You can set have two toolbars or in a single toolbar you could have a Container with a vbox layout with two containers within it acting as your two rows. The two sub-containers you would give hbox layouts which is what the toolbar has by default.

jgrocha
8 Jan 2015, 6:45 AM
var bbar1 = Ext.create('Ext.toolbar.Toolbar', {
items: [{
text: '-1',
itemId: 'previousframe',
icon: 'resources/images/icons/fam/control_previousframe.png',
enableToggle: false
}, {
text: 'Play',
itemId: 'playall',
icon: 'resources/images/icons/fam/control_play.png',
enableToggle: true,
width: 72
}]
});
var bbar2 = Ext.create('Ext.toolbar.Toolbar', {
items: [{
// text : 'Rewind',
itemId: 'rewindall',
icon: 'resources/images/icons/fam/control_rewind.png',
enableToggle: false
},{
text: 'Next',
itemId: 'nextvideo',
// icon : 'resources/images/icons/fam/control_play.png',
enableToggle: false
}]
});
this.bbar = {
layout: 'vbox',
items: [bbar1, bbar2]
};