利用富文本实现 UILabel 部分高亮

需求

我们需要实现一个类似于下图的功能，常见的是在app中查看协议之类的。

示意图

问题：

• 局部高亮
• 点击后跳转
  • 仅仅是高亮的部分作为按键的相应热区 —— 似乎一些像YYLabel的第三方库有实现。但是一些应用场景下，只将高两部分作为热区，不容易点到。另外是涉及第三方库的应用，这里先不做讨论
  • 为了增加交互，将整个 UILabel的区域作为热区。
• 文本的展示，必须兼容多语言

实现思路

实际就是利用UILabel的 attributedText 属性，对text的不同range做不同的富文本属性设置

代码

暂时只提供 swift 代码

class ShowServiceAgreementTipView: UILabel {
    private var onCheckAgreement: () -> ()
    
    init(onCheckAgreement: @escaping OnCallbackWithNoParams) {
        self.onCheckAgreement = onCheckAgreement
        super.init(frame: CGRect.zero)
        
        let normalText = myLocal("register_equals_accept") // 语言国际化
        let serviceText = myLocal("service_protocol") // 语言国际化
        let tipText = normalText + " " + serviceText

        let wholeRange = (tipText as NSString).range(of: tipText)
        let normalRange = (tipText as NSString).range(of: normalText)
        let serviceRange = (tipText as NSString).range(of: serviceText)
        
        let tipAttributeText = NSMutableAttributedString(string: tipText)
        // 针对不同区域添加富文本属性
        tipAttributeText.addAttribute(NSAttributedStringKey.font, value:  UIFont(),
                                      range: wholeRange)
        tipAttributeText.addAttribute(NSAttributedStringKey.foregroundColor, value: UIColor(hexString: "#999999")!,
                                      range: normalRange)
        tipAttributeText.addAttribute(NSAttributedStringKey.foregroundColor, value: UIColor(hexString: "#6F99C4")!,
                                      range: serviceRange)
        
        attributedText = tipAttributeText
        numberOfLines = 0 //设置自动换行
        textAlignment = .center // 设置居中
        
        isUserInteractionEnabled = true // UILabel 默认不响应事件，这里需要另外添加
        
        let gesture = UITapGestureRecognizer(target: self, action: #selector(tapToCheckProtocol))
        addGestureRecognizer(gesture)
    }
    
    @objc private func tapToCheckProtocol() {
        onCheckAgreement()
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}