美文网首页
iOS中IconFont的使用

iOS中IconFont的使用

作者: Z哥 | 来源:发表于2017-02-16 10:16 被阅读215次

什么是IconFont

所谓IconFont, 就是利用图标生成的字体。原理与汉字和emoji一样, 每一个图标对应一个`unicode`编码。

IconFont有什么好处

1. 矢量图, 开发时不需要适配 1x、2x、3x...

2. app包体积减少

如何制作IconFont

1. 使用现成的, [公开图标库](www.iconfont.cn)、[icomoon](https://icomoon.io)等网站上面有很多免费的图标。 选择需要的图标后就可以生成字体库

2. 自己制作的话, 需要进行切图导成svg格式, 再上传到 [公开图标库](www.iconfont.cn)、[icomoon](https://icomoon.io)等网站上生成字体库

如何使用IconFont

1. 将生成的字体库添加到工程文件.

2. 注册字体库.

静态注册: 在Info.plist添加如下字段, 并设置value为对应的字体文件名

动态注册: 根据字体库文件路径注册字体库

public func registerFont(with filePath:String) -> Bool {

    guard let provider = CGDataProvider(filename: filePath) else {
        return false
    }
    let font = CGFont(provider)
    let result = CTFontManagerRegisterGraphicsFont(font, nil)
    return result

}

3. 使用字体库

使用比较简单, 对于label, 直接设置`font`为自定义的字体, 然后设置文本为图标对应的`unicode`。

self.midLabel.font = UIFont(name: "iconfont", size: 30)

self.midLabel.text = "\u{e6a6}"

对于, imageView, 可以先把字体生成图片,再为imageView赋值。

生成图片的实例代码如下:

public static func image(withText text: String?,fontName: String, fontSize: CGFloat, imageSize: CGFloat, color: UIColor = UIColor.black, backGroundColor: UIColor? = nil, offset: CGPoint = CGPoint.zero) -> UIImage? {

    guard fontSize > 0, imageSize > 0, let _ = text, let font = UIFont(name: fontName, size: fontSize) else {
        return nil
    }
    let paragraph = NSMutableParagraphStyle()
    paragraph.alignment = .center
    let attributes = [
        NSForegroundColorAttributeName: color,
        NSParagraphStyleAttributeName: paragraph,
        NSFontAttributeName: font
    ]
    UIGraphicsBeginImageContextWithOptions(CGSize(width: imageSize, height: imageSize), false, 0)
    if let _ = backGroundColor {
        backGroundColor!.setFill()
        let imageRect: CGRect = CGRect(x: 0, y: 0, width: imageSize, height: imageSize)
        UIRectFill(imageRect)
    }
    let rect = (text! as NSString).boundingRect(with: CGSize(width: CGFloat.greatestFiniteMagnitude, height: CGFloat.greatestFiniteMagnitude), options: .usesLineFragmentOrigin, attributes: attributes, context: nil)
    (text! as NSString).draw(in: CGRect(x: offset.x, y: offset.y+(imageSize-rect.height)*0.5, width: rect.width, height: rect.height), withAttributes: attributes)
    let image = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return image
}

第三方库推荐

IconFontSwift ,这个库是我自己造的轮子, swift3版本, 比较简单, 容易上手. 有简单的内建字体库, 共80个图标。支持使用自定义的字体库

IconFontKit , oc版本

FontAwesomeKit , oc版本, 拥有丰富的内建字体库

相关文章

  • iOS - IconFont的使用

    iOS - IconFont的使用 iOS - IconFont的使用

  • iOS上如何使用iconfont图标

    iOS上如何使用iconfont图标 iOS上如何使用iconfont图标

  • IconFont在iOS中的运用

    IconFont在iOS中的运用 IconFont在iOS中的运用

  • swift项目中使用阿里iconfont

    另外关于iconfont的设置阿里iconfont官网帮助文档有说明,具体参考IOS使用iconfont还有使用i...

  • iOS中IconFont的使用

    什么是IconFont 所谓IconFont, 就是利用图标生成的字体。原理与汉字和emoji一样, 每一个图标对...

  • iOS 中IconFont的使用

    1.什么是iconfont iconFont拆开来看,就是 Icon + Font,这样估计大家应该都能理解是什么...

  • iOS中iconfont的基本使用

    第一步:从iconfont平台选择要使用到的图标,并下载至本地 打开Info.plist文件,增加一个新的Arra...

  • iconfont在iOS中的使用

    iconFont iconFont是利用图标生成的字体,是一种矢量图。原理与汉字和emoji一样, 每一个图标对应...

  • iOS使用iconFont

    时下App越来越向重型App发展,随之带来的就是App容量剧增.而App中五花八门,各式各样的图标图片也是容量增大...

  • iOS - IconFont的使用

    IconFont是啥? 我们通常看到的图标都是以图片形式集成到项目中使用,而 Iconfont 是一套字体图标,和...

网友评论

      本文标题:iOS中IconFont的使用

      本文链接:https://www.haomeiwen.com/subject/hnbcwttx.html