iconfont 字面意义上就是图标字体。用字体的形式来使用图片。优点是占用空间小,不需要考虑屏幕适配。缺点是storyboard xib中无法使用。
生成iconfont需要矢量图。一些网站提供生成iconfont的服务,比如icomoon和Fontello。阿里巴巴矢量图标库和easyicon提供大量优秀的矢量图。下面介绍如何从阿里巴巴图库下载iconfont文件。
iconfont下载
1、注册账号、登录阿里巴巴图库地址
2、登录成功后,顶部工具栏选择图标库,然后点击想要的图标集, 将需要的图片加入到购物车中
4、点击右上角的购物车,点击下载代码,下载iconfont文件
5、下载完成,打开下载目录,iconfont.ttf就是我们需要的文件
使用iconfont文件
1、将iconfont添加到项目中
2、配置plist文件
3、查看字体文件是否添加成功
for (NSString * family in [UIFont familyNames]) {
NSLog(@"familyNames:%@", family);
for (NSString * name in [UIFont fontNamesForFamilyName:family]) {
NSLog(@" name: %@",name);
}
}
打印输出所以的字体文件,查看是否存在iconfont字体文件,如果有说明配置成功
4、使用iconfont
UILabel *label = [[UILabel alloc] init];
label.frame = CGRectMake(100, 100, 100, 100);
[self.view addSubview:label];
//设置label的字体为 iconfont字体
label.font =[UIFont fontWithName:@"iconfont" size:30];
//设置label要显示的图片
label.text = @"\U0000e6df";
label.textColor = [UIColor greenColor];
label.font =[UIFont fontWithName:@"iconfont" size:30]; 这是设置label的字体, @"iconfont"是字体的名称,默认的名称是iconfont,如果需要自定义,可以在图标管理-我的项目-新建项目中指定字体名称,然后将购物车里的图片添加到项目中,然后项目管理-我的项目中下载iconfont
@"\U0000e6df" 是icon图片对应的Unicode编码,如何查看icon图片对应的编码呢? 下载的iconfont.ttf文件夹目录下有个 demo_unicode.html 文件,用Safari打开, 每个图片下面的就是图片对应的名称,需要转换成Unicode形式 '\U0000XXXX';
参考文章
www.jianshu.com/p/3b10bb95b332
segmentfault.com/a/1190000004300281