Barra degli strumenti ExtJS con più righe

Question

È possibile avere un ExtJsToolBar con più righe? Voglio alcuni controlli sulla prima riga e 3 ExtJsButtons sul 2 °. La barra degli strumenti è la barra degli strumenti superiore di un pannello.

Answer 1

Non hai accennato a ciò widget che desideri aggiungere le barre degli strumenti, ma in generale si può aggiungere tutte le barre degli strumenti che si desidera:

var panel = new Ext.Panel(); 
var tool1 = new Ext.Toolbar({...}); 
var tool2 = new Ext.Toolbar({...}); 

panel.add(tool1); 
panel.add(tool2); 
... 

Se vi piace aggiungere barra degli strumenti in più per la parte superiore della griglia , quindi trovare il componente del pannello della griglia e aggiungervi le barre degli strumenti. Potrebbe assomigliare a questo (non testato):

tPanel = grid.getTopToolbar().ownerCt; // get top toolbar's container panel 
tPanel.add(anotherToolbar); 

Answer 2

Non sono sicuro, che sia possibile o meno, ma ciò che si può sempre fare è dividere l'area nord (se si utilizza il layout del bordo per esempio) in due righe usando il layout di riga. Quindi è possibile aggiungere una barra degli strumenti alla riga superiore e l'altra alla seconda riga.

Answer 3

Non sono sicuro se questo è esattamente quello che stai cercando, ma barre degli strumenti è stato rinnovato in Ext 3.0.

si potrebbe desiderare di dare uno sguardo a: http://extjs.com/deploy/ext-3.0-rc1.1/examples/toolbar/toolbars.html

Answer 4

un'occhiata a questo thread nel forum Ext. Descrive come creare una barra degli strumenti e renderla a una barra degli strumenti esistente.

http://www.extjs.com/forum/showthread.php?t=12433

Answer 5

Non sei sicuro di versioni precedenti, ma come di ExtJS 4.0 si può fare in questo modo quando si sta definendo la griglia:

dockedItems: [ 
    { 
     xtype: 'toolbar', 
     dock: 'top', 
     items: [ 
      {text:'Toolbar 1 Button 1'}, 
      {text:'Toolbar 1 Button 2'} 
     ] 
    }, 
    { 
     xtype: 'toolbar', 
     dock: 'top', 
     items: [ 
      {text:'Toolbar 2 Button 1'} 
     ] 
    } 
], 

http://dev.sencha.com/deploy/ext-4.0.2a/docs/#/api/Ext.panel.Panel

Answer 6

Che dire dockedItems sua molto più semplice.

var toolbar1 = { 
    xtype : 'toolbar', 
    dock : 'top', // bottom, right, left 
    items: [...] 
}; 

var toolbar2 = { 
    xtype : 'toolbar', 
    dock : 'top', 
    items: [...] 
}; 

Ext.create('Ext.panel.Panel', { 
    dockedItems: [toolbar1,toolbar2] 
}); 

So che è piuttosto vecchio e già risposto, può essere che può aiutare qualcuno :)