可用于ExtJS Panel的"工具"按钮的图标

jm2*_*jm2 13 extjs4

如何设置Panel的"标题栏"中使用的图标?也许我需要自己添加一个图像,但如果是这样,我想我需要在某处定义或配置?

{
    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');
            }
        },
        ...
    ]
},
Run Code Online (Sandbox Code Playgroud)

Jom*_*Jom 23

可以使用类型config指定一组25个图标.查看http://docs.sencha.com/ext-js/4-0/#!/api/Ext.panel.Tool-cfg-type

要添加符号使用

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

指定的类型:'add'不在列表中


Far*_*ish 15

如果要添加自己的工具类型并能够为其分配自己的图像,可以执行以下操作:

在css文件中添加一个css类:

.x-tool-mytool { background-image: url(path_to_your_image_file) !important; }
Run Code Online (Sandbox Code Playgroud)

然后在您的工具中,只需使用'mytool'作为类型:

            {
                type:'mytool',
                tooltip: 'This is my tool',
                handler: function(event, toolEl, panel){
                    // my tool logic
                }
            }
Run Code Online (Sandbox Code Playgroud)

确保在工具类型中使用与css类后缀相同的名称.