14

是否可以有一个多行的 ExtJsToolBar?我想要第一行的一些控件和第二行的 3 个 ExtJsButtons。工具栏是面板的顶部工具栏。

4

6 回答 6

19

不确定早期版本,但从 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

于 2011-09-16T14:53:32.257 回答
17

您还没有提到要添加工具栏的小部件,但通常您可以添加任意数量的工具栏:

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);
于 2009-05-07T08:13:37.927 回答
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]
});  

我知道它很旧并且已经回答了,也许它可以帮助某人:)

于 2014-07-14T07:09:45.403 回答
1

我不确定这是否正是您正在寻找的,但工具栏已在 Ext 3.0 中进行了改进。

您可能想看看: http ://extjs.com/deploy/ext-3.0-rc1.1/examples/toolbar/toolbars.html

于 2009-05-20T02:03:08.637 回答
0

在 Ext 论坛中查看此线程。它描述了如何创建工具栏并将其呈现到现有工具栏。

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

于 2010-01-21T14:05:59.380 回答
0

我不确定是否可能,但是您始终可以做的是使用行布局将北部区域(例如,如果使用边框布局)分成两行。然后,您可以将一个工具栏添加到顶行,将另一个工具栏添加到第二行。

于 2009-05-06T12:43:42.573 回答