美文网首页
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的使用

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