Question

因此，我以编程方式创建多个UILabel位于StackView内，并使用UILongPressGestureRecognizer识别触摸。在写作时，我使用StackView spacing选项为标签提供一些余量，但我想删除死区，因为触摸不是很准确。< / p>

stackView = UIStackView()
stackView.axis = .vertical
stackView.alignment = .center
stackView.distribution = .fillEqually
stackView.spacing = 12
let recognizer = UILongPressGestureRecognizer(target: self, action:#selector(self.handleGesture))
stackView.isUserInteractionEnabled = true
recognizer.delegate = self as? UIGestureRecognizerDelegate
stackView.addGestureRecognizer(recognizer)
view.addSubview(stackView)

let label = UILabel()
label.textColor = UIColor.gray
label.textAlignment = .center
label.font = UIFont.boldSystemFont(ofSize: 11.0)
label.text = "A"
label.backgroundColor = UIColor(white: 0.15, alpha: 0.8)
label.roundedButton()
stackView.addArrangedSubview(label)

.roundedButton是这样的扩展程序：

extension UILabel {
    func roundedButton(){
        self.layer.cornerRadius = 6
        self.layer.borderWidth = 1
        self.layer.masksToBounds = true
    }
}

我尝试使用inset添加填充，但这位于后台。有什么想法吗？

实现这一目标的一种方法是将标签放在UIView内，但必须有办法只使用UILabel

Answer 1

在UIView中包裹UILabel，并检测containerView内的触摸。

let stackView = UIStackView()
stackView.axis = .vertical
stackView.alignment = .center
stackView.distribution = .fillEqually
stackView.spacing = 0
view.addSubview(stackView)

let label = UILabel()
label.textColor = UIColor.gray
label.textAlignment = .center
label.font = UIFont.boldSystemFont(ofSize: 11.0)
label.text = "A"
label.backgroundColor = UIColor(white: 0.15, alpha: 0.8)
label.roundedButton()

let containerView = UIView()
containerView.backgroundColor = UIColor.clear
containerView.translatesAutoresizingMaskIntoConstraints = false
containerView.addSubview(label)
label.leadingAnchor.constraint(equalTo: containerView.leadingAnchor).isActive = true
label.trailingAnchor.constraint(equalTo: containerView.trailingAnchor).isActive = true
label.topAnchor.constraint(equalTo: containerView.topAnchor, constant: 6).isActive = true
label.bottomAnchor.constraint(equalTo: containerView.bottomAnchor, constant: -6).isActive = true
stackView.addArrangedSubview(containerView)

第二个解决方案 - 继承UILabel以添加您需要的形状的子图层，并设置label.backgroundColor = UIColor.clear：

class MyLabel: UILabel {

    let subLayer: CALayer = {
        let subLayer = CALayer()
        subLayer.backgroundColor = UIColor(white: 0.15, alpha: 0.8).cgColor
        subLayer.cornerRadius = 6
        subLayer.borderWidth = 1
        return subLayer
    }()

    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        commonInit()
    }

    private func commonInit() {
        layer.addSublayer(subLayer)
        subLayer.frame = CGRect(x:0, y:6, width: bounds.width, height: bounds.height - 12)
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        subLayer.frame = CGRect(x:0, y:6, width: bounds.width, height: bounds.height - 12)
    }
}

使用第二种解决方案时，您应该添加填充，但可以在其他答案/评论中提供。

Answer 2

感谢Predag，我能够达到我想要的效果。分享最终结果，因为我添加了一些帮助器来设置背景和边框。

class SuperUILabel : UILabel {
    var spacing: CGFloat = 5

    var subLayer: CALayer! = {
        let subLayer = CALayer()
        subLayer.cornerRadius = 6
        subLayer.borderWidth = 1
        return subLayer
    }()

    func setBorderColor(color: CGColor)
    {
        self.subLayer.borderColor = color
    }

    func setBackgroundColor(color: UIColor) {
        self.subLayer.backgroundColor = color.cgColor
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        commonInit()
    }

    private func commonInit() {
        self.layer.borderWidth = 0
        layer.addSublayer(subLayer)
        subLayer.frame = CGRect(x: self.spacing / 2, y: self.spacing / 2, width: bounds.width - self.spacing, height: bounds.height)

    }

    override func layoutSubviews() {
        super.layoutSubviews()
        subLayer.frame = CGRect(x: self.spacing / 2, y: self.spacing / 2, width: bounds.width - self.spacing, height: bounds.height - self.spacing)
    }
}

Answer 3

创建自定义标签并根据您的要求更改UIEdgeInset（您想要显示的空间）

class CustomLabel: UILabel {


    override func drawText(in rect: CGRect) {
        let insets = UIEdgeInsets(top: topInset, left: leftInset, bottom: bottomInset, right: rightInset)
        super.drawText(in: UIEdgeInsetsInsetRect(rect, insets))
    }
}

向UILabel添加可点击的边距

3 个答案: