javascript - 在 ExtJS 中使用图标

Question

我正在尝试将图标添加到 extJS 中的工具栏按钮。就我而言，我希望按钮中有一个刷新图标。

是否有一种简单和标准的方法来做到这一点？我似乎无法在网络上找到任何像样的文档。

我的工具栏按钮:

{
            text: 'Reset',
            icon: 'refresh',
            tooltip: 'Reset Grid Layout'
}

将刷新放在这里不会执行任何操作。我的按钮上有一个空白区域，本来应该有东西的地方。 IE。它理解“图标”，但不理解“刷新”。

• 是否必须输入某些 ExtJS 子目录的完整路径？
• 有一些可以使用的图标集列表吗？

Answer 1

1. 您可以使用 iconCls: 并提供一个 css 类来设置正确的背景集以及其他信息(大小、颜色等)

2. 您可以使用 icon: 并传递图像的相对路径。

3. 有一些字形我不太了解，但网上有一些很好的例子(例如 this )。基本上，您加载图标字体并在按钮的 glyph: 配置中设置字符代码。

4. 最后还有一些非常漂亮的面板标题图标，名为:tools。默认主题可见here 。海王星的要好得多。检查Kitchen Sink examples 。 (如果你找到他们的类名，你可以在任何地方使用它们，并进行一些调整)。 这些是在您的面板config中定义的。

示例:

config: {
  ...., 
  tools: [
    {type: 'refresh'},
    {type: 'save'}, 
    ...]  
},

更多信息请访问the official documentation .