iOS开发中运用文字图标iconfont

如果把全部图标做成图片放在项目中,如果把全部图标做成图片放在项目中

在iOS的开发中,种种图标的施用是不可翻盘的,若是把全路图标做成图片放在项目中,那么随着项目标逐月庞大起来,图片所占的地方就会越加大,安装包也就随之变大了,假如图标须求基于分化的气象改成使用不一致的颜料,那么,就算做成图片就须求多张不相同颜色的图纸,对于能转换皮肤的APP来说,安装包也就会更大,为了让APP的安装包瘦身,iconfont就生出了。关于iconfont的牵线与打造方法就临时不进行介绍了。

在iOS的费用中,各样图标的选取是不可翻盘的,借使把全部图标做成图片放在项目中,那么随着项目标逐月庞大起来,图片所占的位置就会愈加大,安装包也就随之变大了,倘诺图标须求依照分歧的情景改成使用不一致的水彩,那么,纵然做成图片就须要多张分裂颜色的图纸,对于能转换皮肤的APP来说,安装包也就会更大,为了让APP的安装包瘦身,iconfont就生出了。关于iconfont的牵线与制作方法就临时不开展介绍了。

第一步:获取iconfont文件。

第一步:获取iconfont文件。

商店会有UI做图,让他俩提供文件就好了,借使协调上学测试或者做和好的序列,就需求团结找材料了。我平日用的是阿里巴巴的图标库(http://www.iconfont.cn)。
开拓网址,搜索你必要的图标
[图片上传失败…(image-f28a5a-1513742643098)]
举手投足鼠标到图标上,点击购物车的小图标,然后点击右上角的购物车小图标,
[图片上传战败…(image-d6c9a1-1513742643099)]
点击下载代码,就可以把下载一个涵盖iconfont的压缩包,文件夹的目录如下图
[图片上传失利…(image-9116d6-1513742643099)]

供销社会有UI做图,让他俩提供文件就好了,若是协调上学测试或者做要好的品种,就要求团结找材料了。我日常用的是阿里巴巴(Alibaba)的图标库(http://www.iconfont.cn)。
开拓网址,搜索你需要的图标
图片 1
移动鼠标到图标上,点击购物车的小图标,然后点击右上角的购物车小图标,
图片 2
点击下载代码,就可以把下载一个涵盖iconfont的压缩包,文件夹的目录如下图
图片 3

第二步:导入ttf文件

第二步:导入ttf文件

将文件夹中的iconfont.ttf文件间接拖入到项目中,记得勾选Add to
targets中的选项

将文件夹中的iconfont.ttf文件直接拖入到项目中,记得勾选Add to
targets中的选项

第三步:修改info.plist

第三步:修改info.plist

点击添加按钮,输入UIAppFonts,点击回车,会自行变成名称为Fonts provided
by
application的数组,点击添加一个item,类型为String,输入iconfont.ttf,这么些是您刚导入的公文的名字,点击回车,配置已毕;

点击添加按钮,输入UIAppFonts,点击回车,会活动变成名称为Fonts provided
by
application的数组,点击添加一个item,类型为String,输入iconfont.ttf,这几个是您刚导入的公文的名字,点击回车,配置完成;

第四步:查看iconfont中的图标的编码

第四步:查看iconfont中的图标的编码

俺们拔取的是unicode,所以,在刚刚下载的文件夹中找到demo_unicode.html文件,双击打开,可以看到如下内容
[图片上传败北…(image-4362db-1513742643099)]
中间的图标名称下边的一个字符串就是大家须要的编码,只是我们必要将其开展转换,固然是Objective-C,大家须要将其转为\U0000e642,假诺是swift,我们须求将其转为\u{e642},每个图标的编码分裂等,可是对应涉及是同等的,每个iconfont文件中恐怕持续一个图标,使用的时候就根据图标编码转成对应的即可使用;

咱俩选择的是unicode,所以,在刚刚下载的文件夹中找到demo_unicode.html文件,双击打开,可以观察如下内容
图片 4
里头的图标名称上面的一个字符串就是大家需求的编码,只是我们需求将其进行转移,如若是Objective-C,咱们必要将其转为\U0000e642,假如是swift,大家须求将其转为\u{e642},每个图标的编码差距,不过对应涉及是一律的,每个iconfont文件中或许不止一个图标,使用的时候就依据图标编码转成对应的即可使用;

第五步:在类型中应用iconfont

第五步:在品种中利用iconfont

自家用的是swift,Objective-C的行使方式接近,你们可以自己尝尝,只是编码的转移结果分化

我用的是swift,Objective-C的选用办法接近,你们可以协调尝试,只是编码的变换结果分裂等

let iconLabel = UILabel.init(frame: .init(x: 0, y: 0, width: 100, height: 30))
iconLabel.text = "\u{e642}"
iconLabel.font = UIFont.init(name: "iconfont", size: 15)
let iconLabel = UILabel.init(frame: .init(x: 0, y: 0, width: 100, height: 30))
iconLabel.text = "\u{e642}"
iconLabel.font = UIFont.init(name: "iconfont", size: 15)

内部的安装font中的name是您导入文本的名目,假设你想给图标一个颜料,直接设置label的公文颜色即可,借使设置大小,直接设置font就行

内部的设置font中的name是你导入文本的名号,假若您想给图标一个颜色,直接设置label的文本颜色即可,如果设置大小,间接设置font就行

小结:文字图标的使用很便宜,也能让安装包减弱不小的体积,项目中图标太多或者随时必要更换图标颜色的话,提议接纳,若是唯有几个同时不需要天天更换颜色,这就从不更加须求了,切多少个小图标就行了。

小结:文字图标的利用很便利,也能让安装包减弱不小的体积,项目中图标太多或者随时须求更换图标颜色的话,提出利用,若是唯有多少个同时不需求时刻更换颜色,那就不曾非常必要了,切几个小图标就行了。

即便有哪些地点是有荒唐的,欢迎指正,调换是擢升技术的一种方法。

即使有啥地点是有错误的,欢迎指正,沟通是升迁技术的一种办法。