Toolbar not shown

Question

i have a viewport with border layout. I use, the north, center and south panels. In the north panel i want to show a Toolbar. My toolbar definition is:

 Ext.define('AM.view.ui.Toolbar',{
    extend: 'Ext.toolbar.Toolbar',
    alias: 'widget.wtToolbar',

    initComponent: function(){
        this.items = [
            {text: 'Aplicación'},
            {text: 'Gestión'},
            {text: 'Automatización'}
        ];
        this.callParent(arguments);
    }
});

And the viewport:

var tbar = Ext.create('AM.view.ui.Toolbar',{});
console.log(tbar);
Ext.create('Ext.container.Viewport',{
    layout: 'border',
    items:[
        {region: 'north', item: tbar},
        {region: 'center', html: 'Centro'},
        {region: 'south', html: 'Sur'}
    ]
});

In Firebug the instance of Toolbar is shown. But, not appear in the north panel. Any ideas ?.

kevhender kevhender · Accepted Answer · 2013-08-27T13:21:37

There is no config param item, you need to use items. You can set this as an array, or as a single object.

However, if your north region is only there for the toolbar, I would suggest adding it to the center region as a dockedItem. See the docs here: http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.panel.AbstractPanel-cfg-dockedItems

Toolbar not shown

1 Answers