0

I'm new in extjs. Currently a panel have been created and set to north region.

Ext.create('Ext.panel.Panel', {
                                layout: {
                                            type: 'border'
                                        },
                                bodyStyle: 'background: yellow;',
                                height  : 700,
                                width   : '100%',
                                renderTo: Ext.get("example"),
                                items   : [{
                                            title: 'navigationBar',
                                            header: false,
                                            region: 'north',
                                            xtype: 'panel',
                                            //margins: '5,5,5,5',
                                            items: [
                                                    MenuBar
                                                    ]
                                            }

And I also create a toolbar in my child class, which ready to call from my parent class and place to the north region panel.

Ext.define('adminInterface', {
extend: 'Ext.toolbar.Toolbar',
items: [{
            xtype: 'tbbutton',
            text: 'Button',
            },{
            xtype: 'tbbutton',
            text: 'Button1',
            menu: [{
                    text: 'Good',
                    },{
                    text: 'Better',
                    },{
                    text: 'Best',
                    }]}]

});

Once I execute the code, the toolbar variable from child class was call, but it not show out the interface.

Thanks for anyone share their information.

4

2 回答 2

1

您好，请参考我的示例

Ext.create('Ext.panel.Panel', {
    title: 'Hello',
    width: 200,
    html: '<p>World!</p>',
    renderTo: Ext.getBody(),
    tbar: new Ext.Toolbar({ 
        //your Toolbar config options
      })
});

我们仍然可以从现有帖子中看到更多示例，如下所示

如何在 extjs 中将工具栏添加到我的布局中？

Extjs 4 将工具栏添加到面板 dockeditems 运行时

于 2013-07-17T12:13:11.483 回答
0 
var myBtnHandler = function(btn) {
Ext.MessageBox.alert('You Clicked', btn.text);
},

fileBtn = Ext.create('Ext.button.Button', {
text : 'File',
handler : myBtnHandler
}),

editBtn = Ext.create('Ext.button.Button', {
text : 'Edit',
handler : myBtnHandler
}),

tbFill = new Ext.toolbar.Fill();

var myTopToolbar = Ext.create('Ext.toolbar.Toolbar', {

items : [
fileBtn,
tbFill,
editBtn
]
});

var myBottomToolbar = [
{
text : 'Save',
handler : myBtnHandler
},
'-',
{
text : 'Cancel',
handler : myBtnHandler
},
'->',
'<b>Items open: 1</b>'
];


var myPanel = Ext.create('Ext.panel.Panel', {
width : 200,
height : 150,
title : 'Ext Panels rock!',
collapsible : true,
renderTo : Ext.getBody(),
tbar : myTopToolbar,
bbar : myBottomToolbar,
html : 'My first Toolbar Panel!'
});
于 2015-01-15T07:46:01.320 回答