Swift or Objective-C IconFont 字体的使用

IOS可以直接使用单个icon(svg,png)。也可以直接引入字体应用:

1:将您从IconFont平台下载的字体文件(.ttf)添加到工程中;

打开Info.plist文件,增加一个新的Array类型的键,键名设置为UIAppFonts(Fonts provided by application),增加字体的文件名:“iconfont.ttf“

2、Objective-C 使用IconFont字体

UILabel * label = [[UILabel alloc] initWithFrame:self.view.bounds];
UIFont *iconfont = [UIFont fontWithName:@"uxIconFont" size: 34];
label.font = iconfont;
label.text = @"\U00003439 \U000035ad \U000035ae \U000035af \U000035eb \U000035ec";
[self.view addSubview: label];
//一般情况下,iconfont多用于UIImage类。可以写一个UIImage+iconfont的分类来实现icon作为图片的功能。+ (UIImage*)imageWithIcon:(NSString*)iconCode inFont:(NSString*)fontName size:(NSUInteger)size color:(UIColor*)color {
    CGSize imageSize = CGSizeMake(size, size);
    UIGraphicsBeginImageContextWithOptions(imageSize, NO, [[UIScreen mainScreen] scale]);
    UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, size, size)];
    label.font = [UIFont fontWithName:fontName size:size];
    label.text = iconCode;
    if(color){
        label.textColor = color;
    }
    [label.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *retImage = UIGraphicsGetImageFromCurrentImageContext();
    return retImage;
}

这里有两个地方注意下:

  • 创建 UIFont 使用的是字体名,而不是文件名;
  • 文本值为 8 位的 Unicode 字符,我们可以打开 demo.html 查找每个图标所对应的 HTML 实体 Unicode 码,比如: "店" 对应的 HTML 实体 Unicode 码为:0x3439 转换后为:\U00003439 就是将 0x 替换为 \U 中间用 0 填补满长度为 8 个字符

3、Swift 3.0  使用IconFont字体

 let label =  UILabel(frame: CGRect(x: 0, y: 0, width: info.textSize!, height: info.textSize!))
 label.font = UIFont(name: "IconFont", size: 25)
 label.textAlignment = .center
 label.text = \u{e60a}
 self.view.addSubview(label)    
//一般情况下,iconfont多用于UIImage类。可以写一个分类继承 UIImage 来实现icon作为图片的功能。open class func iconbWithInfo(_ info: IconInfo) -> UIImage{

        let imageSize: CGSize = CGSize(width: info.textSize!, height: info.textSize!)
        UIGraphicsBeginImageContextWithOptions(imageSize, false, UIScreen.main.scale)

        let label =  UILabel(frame: CGRect(x: 0, y: 0, width: info.textSize!, height: info.textSize!))
        label.font = UIFont(name: "IconFont", size: 25)
        label.textAlignment = .center
        label.text = info.text

        if (info.textColor != nil) {
            label.textColor = info.textColor
        }

        label.layer.render(in: UIGraphicsGetCurrentContext()!)
        let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
        return image

    }

注:Swift 使用 Unicode 编码与 OC 不同,Swift 的是 \u{e60a} 而 OC 是 \U0000e60a 这点要注意。

最后,补充 阿里字体矢量图标库

时间: 2024-08-03 14:17:32

Swift or Objective-C IconFont 字体的使用的相关文章

CSS3属性+iconfont字体图标的使用方法

CSS3属性文本阴影:text-shadow:水平阴影 垂直阴影 模糊度 颜色: 可以多组值共同存在,用逗号隔开多层文本阴影的设置:text-shadow:第一层,第二层,第三层: 文本换行: 在单词内部换行: word-wrap:: normal:默认值,不允许在单词内部换行. break-word:允许单词内部换行. word-break:: break-all 允许在单词内部换行 keep-all 允许在换行点换行,单词内部不换行盒子阴影: box-shadow:水平阴影 垂直阴影 模糊度

如何使用iconfont字体图标代替网页图片?

一.IconFont的优点 1.轻量性 可以减少http请求,可以配合html5离线存储做性能优化,有利于后期维护. 2.灵活性 可以自由变换IconFont大小(不失真),可以修改IconFont颜色,可以添加阴影,旋转,透明度等视觉效果. 3.兼容性 图标字体IconFont支持所有现代浏览器,包括IE低版本. 二.IconFont的缺点 1.图标字体只能被渲染成单色或者css3的渐变色: 2.设计自已的IconFont需要花费大量时间,也会增加前端重构的成本: 3.Firefox和IE9不

为什么我们放弃css sprite使用iconfont字体图标

说在开头 前面有一篇博客说道,项目中使用压缩和css sprite技术对图标进行分类和组合: 但随着项目的不断完善,我们也遇到了很多问题:   1.如何对图标进行分类:刚开始还比较好,我们对图标进行分类,大概有银行卡图标一类,增删改图标一类,支付类 型一类,等等.但随着,图标的不断增加和业务直接的交叉,发现分类变得很困难,渐渐失去耐心.如果,把所有图标集成到一张图:但是有这样一种情况:有些页面只使用了一个图标,同时用户只在这个页面进行操作:却要下载一整张大图,浪费资源. 2.图标位置不好控制,很

IOS-Swift、Objective-C、C++混合编程

1.Objective-C调用C++代码 后缀为m文件的是Objective-C的执行文件,而后缀为mm文件的是Objective-C++文件. 直接在Objective-C中是无法调用C++代码的,所以如果需要在Objective-C调用C++语言就需要直接将后缀m文件改为mm,然后就可以调用C++代码了. Objective-C兼容C,Objective-C++兼容C.C++. 接下来是在OC工程中创建C++文件,并调用C++的代码: 然后在OC文件中直接用C++的语法调用C++,所以前提是

iconfont字体图标的使用

一.准备工作 1.首先,进入阿里的矢量图标库,在这个图标库里面可以找到很多图片资源,当然了需要登录才能下载或者使用,用GitHub账号或者新浪微博账号登录都可以 2.登录以后,可以搜索自己需要的资源,然后直接下载使用,或者建立图标库然后再使用,例如这里以删除的图标为例 a) 搜索删除图标 b) 选择需要的图标,然后可以执行三种操作:添加入库.收藏或者直接下载,可以根据自己的实际情况来选择相应操作,这里选择添加入库,操作完可以看到图标已经添加进右上角的购物车里了 c) 点击右上角的购物车,可以看到

iconfont字体图标的使用方法--超简单!

我之前因为项目用bootstrap比较多,所以使用font awesome字体图标比较多,后来接触到了iconfont,发现想要的什么图标都有,还可以自定义图标,非常强大!之前看了一波教程,觉得繁琐,自己弄明白后感觉如此简单,做了这么个简单教程,直接上图,简单粗暴,避免新手走弯路,这里讲解的默认是元素使用类名; step 1:百度iconfont,找到阿里巴巴矢量图标库官网,然后注册登录,或者用github登录也行,此步骤跳过; step 2:找到图标管理->我的项目->然后新建项目: 右边点

小程序入坑(一)---如何引入iconfont 字体图标

最近一直忙于日常任务,其实是懒癌又犯了..........不过因为自己的"懒癌","不思进取"给自己挖了不少坑. 一,小程序工具的安装 打开简易小程序的官网https://mp.weixin.qq.com/debug/wxadoc/dev/,,点击 导航栏里的"工具"->点击"微信开发者工具",如图: 进入下载开发工具页面,然后根据自己的电脑配置选择相应的压缩包. 二.创建一个自己的项目 1.安装好"微信开发工

iconfont字体图标的使用方法

我之前因为项目用bootstrap比较多,所以使用font awesome字体图标比较多,后来接触到了iconfont,发现想要的什么图标都有,还可以自定义图标,非常强大!之前看了一波教程,觉得繁琐,自己弄明白后感觉如此简单,做了这么个简单教程,直接上图,简单粗暴,避免新手走弯路,这里讲解的默认是元素使用类名; step 1:百度iconfont,找到阿里巴巴矢量图标库官网,然后注册登录,或者用github登录也行,此步骤跳过; step 2:找到图标管理->我的项目->然后新建项目: 右边点

页面添加iconfont字体-[超详细]-支持彩色

第一步: 去矢量图官网注册一下,获取小图标(字体) 的来源 (也可以是其他类似的网站)这里以 阿里妈妈矢量图 官网为例,因为图标丰富,方便使用. 注册请点:https://www.iconfont.cn/ ---------------------------------------------------------------------------------------------------------------------------------------------------