2009-05-06 65 views
13

ExtJsToolBar有多行可能嗎?我想在第一行添加一些控件,在第二行添加3個ExtJsButtons。 工具欄是面板的頂部工具欄。ExtJS多行工具欄

回答

16

您沒有提到小部件您要添加工具欄什麼,但一般而言,您可以,只要你想添加儘可能多的工具欄:如果你喜歡額外的工具欄添加到網格的頂部

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

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

,然後找到網格的面板組件並添加工具欄。它看起來是這樣的(未測試):

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

第二個例子效果很好,謝謝! – Andron 2014-01-31 16:28:15

0

我不確定,不管它是否可行,但你可以隨時做的事情是將北部地區(如果使用邊界佈局)分成兩行,使用行佈局。然後,您可以將一個工具欄添加到頂部行,將另一個工具欄添加到第二行。

17

不知道關於早期版本,但ExtJS的4.0當你定義的網格,你可以做這樣的:

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

2

什麼dockedItems其太簡單了。

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] 
}); 

我知道它很舊的和已經回答了,可能是它可以幫助別人:)