需求
我们需要实现一个类似于下图的功能,常见的是在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")
}
}
网友评论