转载自:http://blog.csdn.net/qq993284758/article/details/78107412
第一步,我们可以去阿里图标网找我们要的图标:
http://www.iconfont.cn/
然后点击最右上角的购物车,选择svg图可以选择自己想要的颜色。点击:下载素材,选择svg,注意不要选png。png图在手机上会失真的。把svg图片下载下来。
第二步:在assets文件夹下创建一个fonts文件夹,然后把svg图放到里面。
在theme文件夹中,创建文件icons.scss,便于管理
写入样式(注意图片的路径不要错):
- 1
- 2
注意:ios-myIcon是自己起的图标名称,不知为何前面要加ios或者md平台,否则不显示,加就加吧。
第三步:
导入到variables.scss中!必须滴。
- 1
直接在模板中使用!简单吧
- 1
- 2
- 3
效果图:
Tab图标的使用:
tab图标,说白了就是两个图标,一个填充的和一个outline的。通过样式来切换。
在下载的时候,我们找两个对应的就行了,如上面的人头图标,两个都下载下来。
1.加入样式:
- 1
- 2
注意:图标名称都是ios-myIcon-outline,当aria-selected=false时,显示outline的图标,
为true(被选中)时显示fill/填充的图标。注意,你想单个使用时,前面第二步中的那些样式同样是不可以少的。
2.同样在模板中直接用