Icons available for ExtJS's Panel's "tool" buttons

jm2 picture jm2 · May 21, 2012 · Viewed 37.3k times · Source

How can I set icon used in my Panel's "Title Bar"? Maybe I need to add an image myself, but if so I suppose I need to define or configure that somewhere?

{
    xtype: 'treepanel',
    title: 'Projects',
    width: 200,
    store: Ext.data.StoreManager.lookup('projects'),
    tools: [
        {
            type: 'add', // this doesn't appear to work, probably I need to use a valid class
            tooltip: 'Add project',
            handler: function() {
                console.log('TODO: Add project');
            }
        },
        ...
    ]
},

Answer

Jom picture Jom · May 21, 2012

There are a set of 25 icons that can be specified by using the type config. check http://docs.sencha.com/ext-js/4-0/#!/api/Ext.panel.Tool-cfg-type

To get add symbol use

tools:[{
    type:'plus',
    tooltip: 'Add project',
    // hidden:true,
    handler: function(event, toolEl, panel){
        // Add logic
    }
}]

the specified type:'add' is not in the list