Sencha Architect ExtJs 应用程序中的 Icomoon 字形无法正常工作

Question

我正在为我的 extjs 5 应用程序（不是 touch）使用 Sencha Architect 3.0。我需要使用 icomoon 字体实现字形。我正在执行以下步骤。

我有图标集和它的样式，已经在它的 demo.html 页面上工作了。

我已经在资源位置下的 css 文件夹中复制了字体文件夹和相关样式，也使用 Sencha Architect 添加了 css。

也在 style.css 中找到正确的字体位置。例如

@font-face {
font-family: 'icomoon';
src:url('../fonts/icomoon.eot?-lgz2n8');
src:url('../fonts/icomoon.eot?#iefix-lgz2n8') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?-lgz2n8') format('truetype'),
    url('../fonts/icomoon.woff?-lgz2n8') format('woff'),
    url('../fonts/icomoon.svg?-lgz2n8#icomoon') format('svg');
font-weight: normal;
font-style: normal;}

在风格 css 中，我有以下类例如：

[class^="icon-"], [class*=" icon-"] {
font-family: 'icomoon';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;

/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.icon-2008:before {
    content: "\e600";
}

在 Ext 按钮中，我将 iconCls 属性设置为 "icon-2008"，将字形设置为 e600。

它向我显示了按钮上的字形，但在按钮的背景中显示了 &#e600。

在 Sencha CMD 中：sencha 应用程序刷新就好了..

请指出我做错了什么，或者我应该遵循什么步骤？

谢谢

Answer 1

将您的 icomoon 相关 css 包含到您的 app.json 或 index.html
将此行添加到您的 app.js 或 application.js Ext.setGlyphFontFamily('icomoon');
在您的按钮配置文件中，无需提及 iconCls 即可获取字形。您可以改为仅应用字形 cfg.

字形：0xe600 -（非字符串值）

或

字形：'600@icomoon' -（字符串值）

Answer 2

我终于成功了，我遵循的所有步骤都是正确的，只是我做错的是设置字形代码：

我以前设置的Glyph代码是e600@icomoon，正确的表示应该是

glyph: xe600@icomoon

那应该可以了！！

Sencha Architect ExtJs 应用程序中的 Icomoon 字形无法正常工作

Icomoon Glyphs in Sencha Architect ExtJs Application not working

css

extjs

glyph

sencha-architect

extjs5