iOS  文字设置斜体和粗体

问题

iOS 中给文字设置斜体时, 中文下是没有效果的. 这是因为 斜体需要字体的支持, iOS 默认中文字体没有对应的斜体.
所以通过正常途径设置斜体就没有效果.
正常设置斜体:
ps: 以下所有的 setItalic(:) 方法都是 UIFont 扩展的 extension 方法

   func setItalic() -> UIFont {
        var symTraits = fontDescriptor.symbolicTraits
        symTraits.insert([.traitItalic])
        var fontDescriptorVar = fontDescriptor.withSymbolicTraits(symTraits)
        return UIFont(descriptor: fontDescriptorVar ?? fontDescriptor, size: 0)
    }

方案

  1. 不用默认的字体, 使用一种具有斜体样式的字体
    例如:
    Font Family: Arial
    Font: ArialMT
    Font: Arial-BoldMT
    Font: Arial-BoldItalicMT //加粗斜体
    Font: Arial-ItalicMT //斜体

  2. 使用 CGAffineTransform 对字体进行处理
    我们需要的效果是以左下角的锚点进行倾斜

 func setItalic() -> UIFont {
        var symTraits = fontDescriptor.symbolicTraits
        var fontDescriptorVar = fontDescriptor.withSymbolicTraits(symTraits)
        fontDescriptorVar = fontDescriptorVar?.addingAttributes([.matrix: CGAffineTransform.skew(c: -15*CGFloat.pi/180, b: 0)])
        return UIFont(descriptor: fontDescriptorVar ?? fontDescriptor, size: 0)
    }
extension CGAffineTransform {
    static func skew(c: CGFloat, b: CGFloat) -> CGAffineTransform {
        var transform = CGAffineTransform.identity
        transform.c = -c
        transform.b = b
        return transform
    }
}

这是会有一个问题, 当需要设置粗斜体的时候又该怎么处理?
直接使用 traitBold 处理

 func setItalic(isBold: Bool) -> UIFont {
        var symTraits = fontDescriptor.symbolicTraits
        if isBold {
            symTraits.insert([.traitBold])
        }
        var fontDescriptorVar = fontDescriptor.withSymbolicTraits(symTraits)
        fontDescriptorVar = fontDescriptorVar?.addingAttributes([.matrix: CGAffineTransform.skew(c: -15*CGFloat.pi/180, b: 0)])

        return UIFont(descriptor: fontDescriptorVar ?? fontDescriptor, size: 0)

    }

在外界通过 UIFont.systemFont(ofSize: 17 weight: .bold) 设置, 如果是 调用 setItalic() 设置斜体的方式, 效果是粗体会消失
这时应该使用 setItalic(isBold: Bool) 方法

3. 直接对控件进行 CGAffineTransform

可以直接对 UILabel 等控件设置 transform 属性进行处理

var testLabel = UILable(frame: CGRect(x: 100, y: 100, width: 200, height: 40))
testLabel.text = "斜体设置"
let matrix = CGAffineTransformMake(1, 0, tanf(-15 * (CGFloat)M_PI / 180), 1, 0, 0)
testLabel.transform = matrix
self.view.addSubview(testLabel)

4. 对富文本进行处理

对 NSAttributeString 设置 key 为 .obliqueness, value 为 倾斜角度的属性值
类似:

  let attr = NSAttributedString(string: "倾斜设置", attributes: [.obliqueness: 15*CGFloat.pi/180])

这是我们字体绘制文字时的解决方案

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容