0

MyApp 只是我正在尝试编辑的“入门”基本应用程序,以便在 Sencha 中找到自己的方式。

现在我要做的就是在标签中添加一个邮件图标。查看 touch/resources/themes/pictos 文件夹(我认为它可以显示作为 pictos 字体的一部分可供我使用的内容)我看到了我想要的名为 mail 的图标。

根据我发现的在线信息,我已将其输入到资源/sass/app.scss 文件中

@import 'sencha-touch/default';
@import 'sencha-touch/default/all';
@include icon('mail');

我已经使用 compass 重新编译了 sass 文件,没有错误

我的 app/view/main.js 文件包含

Ext.define('MyApp.view.Main', {
extend: 'Ext.tab.Panel',
xtype: 'main',
requires: [
    'Ext.TitleBar'
],
config: {
    tabBarPosition: 'bottom',

    items: [
        {
            title: 'Welcome',
            iconCls: 'home',

            styleHtmlContent: true,
            scrollable: true,

            items: {
                docked: 'top',
                xtype: 'titlebar',
                title: 'App Title'
            },

            html: [
                "Content"
            ].join("")
        },
        {
            title: 'Contact Us',
            iconCls: 'mail',

            styleHtmlContent: true,
            scrollable: true,

            items: {
                docked: 'top',
                xtype: 'titlebar',
                title: 'Contact Us'
            },

            html: [
                "Content"
            ].join("")
        }
    ]
}
});

然后使用 sencha cmd 4 编译 Sencha

现在根据我能找到的所有文档,应该是它,但是图标不显示,我什至尝试按照本教程icomoon添加自定义图标,结果完全相同,编译时没有错误,但是图标不显示。

我应该补充一点,似乎 sencha 使用 css 通过“after”选择器和“content”属性添加图标(字体),但它似乎没有被设置(通过 chrome 检查)。

一如既往地感谢任何帮助。

4

2 回答 2

3

这成功了

@import 'sencha-touch/default'; 
@import 'sencha-touch/default/all';
@include icon-font('Pictos',
inline-font-files('pictos/pictos-web.woff', woff, 'pictos/pictos-web.ttf', truetype,'pictos/pictos-web.svg', svg));
@include icon('mail');
于 2013-11-08T03:01:33.730 回答
0

如果您使用 icomoon 字体,请使用 @include icon-font('mail',inline-font-files('pictos/mail.woff',woff,'pictos/mail.ttf',truetype,'pictos/mail.svg ',svg);

然后包括图标

@inclue icon('mailicon','$',mail);

于 2013-11-05T19:34:26.300 回答