1.下载Font Awesome压缩包。
-
进入下载页面:https://github.com/FortAwesome/Font-Awesome
点击右边的下载源程序
2.解压文件到应用程序目录。
-
将压缩目录下的css和fonts目录拷贝到Extjs项目下的resources目录。如下图:
3.添加css样式引用。
打开app.json文件,在"css"属性中添加css的引用。如下图:
编译app工程
打开终端切换到app项目路径下,输入命令: sencha app build
4.在Extjs中设置glyph的属性显示Font-Awesome图标。
{
xtype : 'button',
glyph:'xf0cb@FontAwesome',
text : '删除'
}
简化glyph编码:
在Application.js启动文件的init事件中初始化glyph:
init:function(){
Ext.setGlyphFontFamily('FontAwesome');
}
然后在view文件中可以直接省略@FontAwesome,如下:
{
xtype : 'button',
glyph:0xf0cb,
text : '增行'
}
5.附加
FontAwesome代码查询网址
http://fortawesome.github.io/Font-Awesome/cheatsheet/