前言

  近日在做项目时,项目组有提出iconfont的技术,便开始查询相关资料。iconfont技术的主要目的是为减少应用体积而生。首先icon代表图标 font代表字体。此技术便是将图标转化为字体,从而达到减小应用体积的目的(这样避免了@2X图和@3X图的使用,只需要一个字体图标就可搞定)。如需在项目中使用iconfont技术,图标矢量图一开始都应合并转化为字体库(这属于UI设计师的工作了)。在这里会简单说明怎么生成字体库和简单的使用!此技术缺点也很明显,只适用于纯色的icon!

  字体库生成

  针对于字体库的生成方案现在推荐大家用的有两个图标字体库生成网站iconmooniconfon。本文以iconmoon为例,选择好图标后转化为字体下载

  基本使用

  在个人项目工程中加入iconmoon.ttf字体库,确保在copy bundle Resources中有添加入字体库,然后在info.plist文件中增加字段Fonts provided by application并在该字段下添加icomoon.ttf。此时只需要在工程使用该字体即可。

       

  在使用的时候需要配置字体名字,然后将对应图标的Unicode编码赋给text即可进行展示,对应图标的Unicode编码在字体下载中的html文件中查看

  使用时只需要将对应的Unicode编码转化为text字符串即可,转化方式为'\U0000 + 对应编码'。示例如下:

    UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(, , , )];
//需要配置为对应的字体
label.font = [UIFont fontWithName:@"icomoon" size:];
//配置上两个对应图标
label.text = @"\U0000e900 \U0000e91f";
//配置图标颜色
[label setTextColor:[UIColor cyanColor]];

  运行程序后便可得到如下效果图:

  

  以上便是iconfont的具体运用方法,有想法的朋友可以直接去试一试了。关于此种技术的使用效率问题和其他生成方式都在参考链接中可以查找到。本文旨在提供最基本的使用方法给大家,如上述有不正确之处欢迎指出!

  参考链接

  使用IconFont减小iOS应用体积

  iconfont,像使用字体一样使用图标

iOS中iconfont(图标字体)的基本使用的更多相关文章

  1. iconfont 图标字体

    iconfont 技术的主要是将图标转化为字体来减少应用体积.如需在项目中使用iconfont技术,图标矢量图一开始都应合并转化为字体库.   优点: 减小体积,字体文件比图片要小 图标保真缩放,解决 ...

  2. 仿站技术——获取和使用某些网站的iconfont图标字体

    前言: 很多前端新手在仿一些大型网站的时候经常遇到一个问题:该网站使用了图标字体——iconfont,虽然现在阿里有开源的iconfont库,但是还是没有原网站的效果(本人强迫症但非处女座).所以此文 ...

  3. iOS中使用自定义字体

    1.确定你的项目工程的Resources下有你要用的字体文件(.ttf或者.odf). 2.然后在你的工程的Info.plist文件中新建一行,添加key为:UIAppFonts,类型为Array或D ...

  4. 微信小程序引用iconfont图标字体解决方案;

    1)首先,登录阿里巴巴iconfont.cn 2)新建项目 3)点击icon收藏 4)加入到test项目中   5)下载到本地解压   6)生成代码   7)复制iconfont.css到xxx.wx ...

  5. vue中的图标字体引入

    网址:https://icomoon.io/app/#/select: 特点:样式多,免费 操作: 1.相中的,随便点,不要钱,generat fonts然后download,得到一个压缩文件,解压, ...

  6. 学习WPF——使用Font-Awesome图标字体

    图标字体介绍 在介绍图标字体之前,不得不介绍图标格式ICON ICON是一种图标格式,我们操作系统中各种应用程序都包含一个图标 比如QQ程序的图标是一个可爱的企鹅,我的电脑是一个显示器图标 ----- ...

  7. 老爷车IE8如何兼容图标字体

    前言 首先这个标题再详细的说就是如何解决font-face在IE8下间歇性出现图标字体渲染失败的解决方案. 如果你还不知道什么是图标字体,可以先阅读:链接1,链接2,链接3 先看在IE8下的问题: 而 ...

  8. 图标字体的使用(fontello.com)字体推荐及使用技巧

    网页设计中为了页面漂亮好看,图标是少不了,网页中使用的图标通常都是使用图片,使用图片图标的有很多弊端,如果你经常制作网页应该有一肚子埋怨. 使用图片图标的弊端 放大图标必须重新作图, 改变颜色必须开启 ...

  9. [iOS开发] 使用第三方字体不生效

    iOS中使用第三方字体并不复杂,通常只需要如下三个步骤: 1. 将第三方字体文件添加到工程(Project)中: 2. 在info.plist中添加一个新的键"Fonts provided ...

随机推荐

  1. MySQL添加用户、删除用户与授权

    MySql中添加用户,新建数据库,用户授权,删除用户,修改密码(注意每行后边都跟个;表示一个命令语句结束): 1.新建用户 1.1 登录MYSQL: @>mysql -u root -p @&g ...

  2. JavaSE基础第一篇

      1.JDK的安装: 包括JRE 和JVM   下载地址: www.oracle.com/www.sun.com 2.环境变量 set path = "bin所在路径" 设置pa ...

  3. 二十四、JDK1.5新特性---泛型

    由于本人认知有限,泛型在使用上没有太大压力,但是尚未具备详细介绍泛型的能力,因此本文只是粗略的描述泛型的相关知识,在以后的学习过程中会对这篇文章进行修改,希望这篇文章不会给读者带来迷惑,特此声明 什么 ...

  4. 图说js中的this——深入理解javascript中this指针

    没搞错吧!js写了那么多年,this还是会搞错!没搞错,javascript就是回搞错! ………… 文章来源自——周陆军的个人网站:http://zhoulujun.cn/zhoulujun/html ...

  5. RevMan简单入门指南

    要画个Forest plot啥的,参考 RevMan软件使用 http://wenku.baidu.com/link?url=VY8pCL81K_34xZuW1Z516PrtOVrAbMt8wkIIp ...

  6. css3样式控制(鼠标滑过 显示标注信息)

    <div class="item"> <h1>A</h1> <div class="tooltip"> < ...

  7. 剑指offer:赋值运算符函数和复制构造函数

    赋值运算符函数 对于定义一个赋值运算符函数时,需要注意一下几点: (1)函数的返回类型必须是一个引用,因为只有返回引用,才可以连续赋值 (2)传入的参数声明为常量引用,可以提高代码效率,同时赋值运算函 ...

  8. easyui关于validatebox实现多重规则验证的实践

    参考资料 http://blog.csdn.net/jumtre/article/details/38510975 http://blog.csdn.net/lybwwp/article/detail ...

  9. Lucene中几种常用的Query

    看完图之后在来详细说明一下. 1.phrasequery是用来查询短语的.注意他只针对英文,对中文并没有什么用处. 核心用法: @Test public void test02(){ //新建查询 P ...

  10. 一个ubuntu phper的自我修养(杂记)

    ubuntu使用杂记 1.flatabulous安装使用. flatabulous是一个ubuntu图标主题. 使用它,必须得安装tweak插件. sudo add-apt-repository pp ...