iconFont在iOS上的使用详解

 iconFont原理:app有个特点,就是支持三方语言包,通过这个特点,我们可以把icon做成字体,注册到系统,这样我们就能通过使用文字的方式去使用icon。其实说白了,系统的字体也是图像,只是这个图像的样子是个字。

     基于这个基础,地球上出现了很多类似icomoon这样把icon生成字体的应用,我们可以直接在这类应用选择icon,然后下载,也可以上传我们自己设计的icon,生成出字体icon,最后把icon文件导入应用,写上几行代码就能实现像显示文字一些样显示icon了。

     这么做的好处:
1,通过icomoon生成的字体icon是矢量图,在各种屏幕上显示都不变形,无需切成@1X,@2X,@3X...这么多的图片
2,icomoon大大的缩减了我们app的大小,是瘦身的一大利器
3,操作简单,若生成icon的对应表,找icon时就不用一个个文件夹去找了

     这么做的坏处:
1,图片的使用变得复杂,这么做当然比直接使用图片要复杂,新手需要学习成本
2,xib文件在UIImageView上设置image时不能直接用这个icon,那么xib到底该怎么用iconFont呢?

     详细用法:
1)访问https://icomoon.io2)点击右上角“IcoMoon App”,会出来茫茫多的小icon,这个时候你选择你想要的icon,或者上传你自己设计的icon3)选好icon之后选择右下角的Generate Font生成icon字体
4)右下角可以Download下来这个icon字体集合,找到里面的.ttf文件,把这个文件拖到工程里面(是否每次新增加icon都要拖入这么一个文件)
5)把下载下来的文件中的style.css打开,找到icon的名称和字符对应关系,把icon字符抽取出来放到工程里面供代码使用。(其实这里还有一点没说,直接下载下来的字符格式是不能直接使用的,因为iconfont注册为系统字体,在我们使用的时候要用Unicode码才能调用得到系统字体,所以我们需要转一下,转码方法是吧/e600转成/ue600,就是在e前面直接加上一个u就可以了,然后在代码里面使用/ue600就可以显示出应有的icon了)
6)在info.plist中加上Fonts provided by application这个节点,下面的值就是字体icon的.ttf文件名

效果图:

iconFont在iOS上的使用详解


更多信息关注快友移动:http://www.58hunlian.com/H5