写在前面的：
在实际项目开发中，我们经常需要制作一些类似按钮的，带圆角边框的标签！
参考效果：
参考效果图
它们不需要响应用户交互，但是【需要根据字数】来【自适应调整】自身的尺寸！……
这里将我自己的经验写下来，供需要的人参考！
实现思路：
- 自定义一个继承自UILabel的子类
- 重写textRect(forBounds:limitedToNumberOfLines:)方法
- 重写drawText(in:)方法
最终效果：
最终效果图
完整代码：
UILabel的子类的定义
//
// BtnStyleLabel.swift
// UIKit-basic
//
// Created by Qire_er on 2021/12/12.
//
import UIKit
class BtnStyleLabel: UILabel {
private var edgeInsets: UIEdgeInsets!
// 从【代码】生成才会调用
init(padding: CGFloat) {
super.init(frame: .zero) // frame 随便给一个
self.edgeInsets = UIEdgeInsets(
top: padding * 0.5,
left: padding,
bottom: padding * 0.5,
right: padding
) // 设置edgeInsets四个方向的参数，具体可根据自己的需求调整
self.layer.cornerRadius = (self.font.pointSize + padding) * 0.45 // 设置圆角边框
self.layer.borderColor = UIColor.systemGray5.cgColor // 设置边框颜色
self.layer.borderWidth = 1 // 设置边框粗细
}
// 从【storyboard】生成才会调用
required init?(coder: NSCoder) {
super.init(coder: coder)
}
// 重写textRect方法
override func textRect(forBounds bounds: CGRect, limitedToNumberOfLines numberOfLines: Int) -> CGRect {
var rect: CGRect = super.textRect(
forBounds: bounds.inset(by: edgeInsets),
limitedToNumberOfLines: numberOfLines
) // 根据edgeInsets，修改绘制文字的bounds
rect.origin.x -= edgeInsets.left // 调整origin的X坐标
rect.origin.y -= edgeInsets.top // 调整origin的Y坐标
rect.size.width += edgeInsets.left + edgeInsets.right // 调整size的width
rect.size.height += edgeInsets.top + edgeInsets.bottom // 调整size的height
return rect
}
// 重写drawText方法
override func drawText(in rect: CGRect) {
super.drawText(in: rect.inset(by: edgeInsets))
}
}
调用部分代码
//
// BtnStyleLabelVC.swift
// UIKit-basic
//
// Created by Qire_er on 2021/12/12.
//
import UIKit
class BtnStyleLabelVC: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let labelPadding: CGFloat = 14 // 定义padding
let labelFontSize: CGFloat = 12 // 定义字号
let itemSpacing: CGFloat = 8 // 定义间距
let labelText = ["经典", "中国风", "BlueStyle", "···", "+"] // 需要创建BtnStyleLabel的文字列表
let labelStack = UIStackView()
labelStack.translatesAutoresizingMaskIntoConstraints = false
labelStack.alignment = .leading // 设置左对齐
labelStack.spacing = itemSpacing // 设置间距
for item in labelText {
let colorLabel = BtnStyleLabel(padding: labelPadding)
colorLabel.text = item
colorLabel.font = .systemFont(ofSize: labelFontSize)
labelStack.addArrangedSubview(colorLabel)
}
let space = UIView() // 用于辅助布局
labelStack.addArrangedSubview(space)
self.view.addSubview(labelStack)
self.view.backgroundColor = .white
// 设置stackView的约束
NSLayoutConstraint.activate([
labelStack.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
labelStack.centerYAnchor.constraint(equalTo: self.view.centerYAnchor),
labelStack.leftAnchor.constraint(equalTo: self.view.leftAnchor, constant: 15),
labelStack.rightAnchor.constraint(equalTo: self.view.rightAnchor, constant: -15)
])
}
}
（==完==）
ps: 以上仅代表个人浅见，如果你有什么高见，也欢迎讨论交流！-
