zoukankan      html  css  js  c++  java
  • 在 iOS 中使用 iconfont

    如何使用自定义字体

    在讲icon font之前,首先先来看看普通自定义字体是如何在ios中使用的,两个原理是一样的。这里以KaushanScript-Regular为例:
     
    Step 1: 导入字体文件
    将字体文件拖入项目(ios支持的字体格式有:.ttf、.otf,其他格式不确定):
     
     
    然后再在项目的资源池中确认字体文件是否加入项目,打开xcode项目的Build Phases中查看:
     
    Step 2: 配置.plist文件
    在.plist文件中注册新加入的字体,.plist文件往往以“[appname]-Info.plist”的形式存在于“Supporting Files”文件夹内。 在.plist文件中添加新属性“Fonts provided by application”,该属性的值是一个数组,这意味着可以在这里注册多个字体。
     
     
    Step 3: 找到字体集名称
    注册完,我们需要检测是否注册成功且取得新字体名称,检测方法就是把所有安装了的字体都打印出来,看看新注册的字体是否在里面:
     
    1. for (NSString* family in [UIFont familyNames]) 
    2.     NSLog(@"%@", family); 
    3.     for (NSString* name in [UIFont fontNamesForFamilyName: family]) 
    4.     { 
    5.         NSLog(@"  %@", name); 
    6.     } 
     
     
    运行完,查看控制台里打印出的所有字体集中是否有新注册的字体,如果有,说明注册成功,并将字体名(在这里是“Kaushan Script”)记住留到后面用。
     
     
    Step 4: 使用新字体
    最后,就是使用你最新加入的字体啦:
    1. UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(10, 60, 300, 50)]; 
    2. label.font = [UIFont fontWithName:@"Kaushan Script" size:35]; 
    3. label.text = @"icon font"; 
    4. label.textColor = UIColorFromRGB(0xFF7300); 
    5. [self.view addSubview:label]; 
     
    效果:
     
    开始使用icon font
    图标字体也是字体,使用方式和上面所说的差不多,只是在套用上有些差别;这里拿fontello的图标字体库为例。
     
    1.选择需要的图标
    在fontello的图标字体库选择自己需要的图标,并下载生成的字体文件。
     
    2.按照上面的步骤将图标字体注册到项目中
    3.找到图标对应的unicode码
    使用FontLab Studio 5工具打开字体文件(比如fontello.ttf),就可以看到图标与unicode码之间的对应关系啦。
     
     
    4.使用图标
     
    1. UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(10, 60, 300, 50)]; 
    2. label.font = [UIFont fontWithName:@"fontello" size:35]; 
    3. label.text = @"U0000E802 U0000E801 U0000E803 U0000E804 U0000E805 U0000E81A"; 
    4. label.textColor = UIColorFromRGB(0xFF7300); 
    5. [self.view addSubview:label]; 
     
     
     
    5.使用emoji表情库
    这里还可以使用苹果emoji表情库的图标,这里不需要新加字体库,只要找到emoji图标和unicode之间的对应关系就好,但是这些图标都不是矢量图,缩放请自重。
    1. UILabel *label5 = [[UILabel alloc] initWithFrame:CGRectMake(10, 480, 300, 50)]; 
    2. label5.text = @"U0000e42aU0000e525U0000e41c"; 
    3. [self.view addSubview:label5]; 
     
    6.效果
     
    7.使用自制图标字体
    如果上面介绍的图标库还满足不了你的需求,或者需要的图标分布在多个图标库而不能集中到一个字体文件中;那么你可能需要自己去制作图标字体文件了。
     
    总结
    这样,在iOS开发上,不仅可以直接去开源图标库找现成的图标用到项目中,而且还可以轻松地改变图标的颜色、大小,相信可以解放不少设计师和工程师的工作量。
     
    上代码
     
    图标字体库
    etao图标字体库(这里有个问题要注意,etao的图标字体名为“Untitled1”,是不是生成字体的同学疏忽啦?)
     
    参考资料

    原文链接:

    http://www.cocoachina.com/industry/20131111/7327.html

    https://github.com/JohnWong/IconFont 

  • 相关阅读:
    修改编译8266NodeMCU固件 打开各种模块以及修改支持智能配网
    3实现8266智能配网并打印出ip地址 8266 lua nodemcu 智能配网 一键配网
    8266 开发环境教程 nodemcu lua开发8266教程 输出世界你好
    代码提交量查询
    antd DatePicker框日期限制
    form表单设置值
    a标签传参数
    css获取页面高度,定位部分信息
    Form自定义校验
    下拉框可输入或输入为下拉框对应的值
  • 原文地址:https://www.cnblogs.com/lurenq/p/7137352.html
Copyright © 2011-2022 走看看