iOS中IconFont的使用

2017-02-16  本文已影响215人  Z哥

什么是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版本, 拥有丰富的内建字体库

上一篇下一篇

猜你喜欢

热点阅读