在ext.grid.panel的'tools'配置选项中显示自定义图像

时间:2012-07-10 19:46:00

标签: extjs4 panel

我只有一个月大的时候有极限并且还在试验。我的问题是:我有一个网格面板,其中包含'tools'配置选项。我使用它来启用/禁用Ext.grid.feature.Grouping变量。 2个处理函数具有通过单击标题右侧显示的2'交叉'按钮来禁用/启用2个视图的逻辑。逻辑很好。但是,我想显示一组自定义图像来代替“交叉”按钮。可以这样做吗?如果有,怎么样?我需要在css代码中进行一些更改吗?

我已经查看过文档并进行了很好的搜索但似乎没有回答我的问题。

1 个答案:

答案 0 :(得分:9)

在您的工具上指定自定义type配置:

Ext.create('Ext.grid.Panel', {
   ...
   tools: [
      {
         type: 'enable-grouping',
         handler: function() {
            ...
         }
      },
      {
         type: 'disable-grouping',
         handler: function() {
            ...
         } 
      }
   ]
});

然后在样式表中定义以下类以设置新工具的样式:

.x-tool-enable-grouping {
   background-image: url('path/to/tool/image/enable-grouping.png');
}

.x-tool-disable-grouping {
   background-image: url('path/to/tool/image/disable-grouping.png');
}

工具图像的大小应为15 x 15 px