如何在 UIButton 的标签子视图上设置 alpha

Question

我想以编程方式为我的按钮标题设置多个对齐组合，如下所示： 我发现最简单的方法是添加两个UILabels 作为我的自定义UIButton 的子视图，并相应地设置自动布局约束。

但是，我不知道如何使标签的行为方式与按钮标题的行为方式相同（即在点击按钮时更改其 alpha）。

我已尝试在.touchUpInside 的目标操作方法中设置其 alpha 属性，但由于它们未附加到按钮状态，因此当用户结束点击按钮时，它们不会将其 alpha 更改回正常状态。

class Button: UIView {

var leftButton = UIButton(type: .roundedRect)
var rightButton = UIButton(type: .roundedRect)

init() {
    super.init(frame: .zero)
    createButton()
}

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

func createButton() {
    self.backgroundColor = UIColor.cyan
    self.layer.borderWidth = 0.5
    self.layer.borderColor = UIColor.blue.cgColor
    self.addSubview(leftButton)
    self.addSubview(rightButton)

    leftButton.setTitle("left", for: .normal)
    leftButton.setTitleColor(UIColor.black, for: .normal)
    leftButton.layer.borderColor = UIColor.yellow.cgColor
    leftButton.layer.borderWidth = 0.5
    leftButton.translatesAutoresizingMaskIntoConstraints = false
    leftButton.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
    leftButton.leadingAnchor.constraint(equalTo: self.leadingAnchor).isActive = true
    leftButton.trailingAnchor.constraint(lessThanOrEqualTo: rightButton.leadingAnchor).isActive = true
    leftButton.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0).isActive = true

    rightButton.setTitle("right", for: .normal)
    rightButton.layer.borderColor = UIColor.green.cgColor
    rightButton.layer.borderWidth = 0.5
    rightButton.setTitleColor(UIColor.black, for: .normal)
    rightButton.translatesAutoresizingMaskIntoConstraints = false
    rightButton.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
    rightButton.leadingAnchor.constraint(greaterThanOrEqualTo: leftButton.trailingAnchor).isActive = true
    rightButton.trailingAnchor.constraint(equalTo: self.trailingAnchor).isActive = true
    rightButton.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0).isActive = true

    leftButton.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
    rightButton.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
}

func buttonTapped() {
    print("button tapped")
}

Answer 1

有更好的方法。

获取两个按钮并将它们保存在stackView中并进行必要的设置。

但要确保两个按钮指向同一个动作。这样用户会觉得它实际上是一个按钮。

这是输出。

我刚刚在故事板中制作了这个。由于我使用的是 stackView，因此以编程方式创建和布局非常容易。我认为你可以做到。 :)

停止闪烁：

自定义每个按钮类型。

如何让两个按钮都只有一个按钮动作？

看看这个受欢迎的stack answer.

这是结果。

Answer 2

您需要区分点击并按住和释放按钮状态。幸运的是，我们可以使用 2 个内置的操作方法。

• Touch Down Action：只要您点击按钮，就会调用此操作。因此，您可以在此处更改标签的 alpha。

• Touch Up Inside：当您释放按钮时调用此操作方法。所以你可以在这里重置你的 alpha。

  @IBAction func touchupInsideAction(_ sender: Any) {
  
      firstLabel.alpha = 1.0
      secondLabel.alpha = 1.0
  }
  
  @IBAction func touchDownAction(_ sender: Any) {
  
      firstLabel.alpha = 0.5
      secondLabel.alpha = 0.5
  
  }
  

Answer 3

通过创建.custom 以外的UIButton（在此示例中我使用.roundedRect），我能够放置两个标签并在单击时突出显示它们，设置一个虚拟标题，将子视图添加到按钮标题本身并按照我的意愿设置它们的约束。它按预期工作。

代码：

class Button: UIView {

let button: UIButton
let leftLabel = UILabel()
let rightLabel = UILabel()

init() {
    button = UIButton(type: .roundedRect)
    super.init(frame: .zero)
    createButton()
}

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}

func createButton() {
    self.addSubview(button)
    button.translatesAutoresizingMaskIntoConstraints = false
    button.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
    button.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true
    button.leadingAnchor.constraint(equalTo: self.leadingAnchor).isActive = true
    button.trailingAnchor.constraint(equalTo: self.trailingAnchor).isActive = true

    button.backgroundColor = UIColor.cyan
    button.layer.borderWidth = 0.5
    button.layer.borderColor = UIColor.blue.cgColor
    button.setTitle(" ", for: .normal)

    if let title = button.titleLabel {
        title.addSubview(rightLabel)
        rightLabel.text = "right"
        rightLabel.translatesAutoresizingMaskIntoConstraints = false
        rightLabel.topAnchor.constraint(equalTo: title.topAnchor).isActive = true
        rightLabel.leadingAnchor.constraint(greaterThanOrEqualTo: title.trailingAnchor).isActive = true
        rightLabel.trailingAnchor.constraint(equalTo: self.trailingAnchor).isActive = true
        rightLabel.bottomAnchor.constraint(equalTo: title.bottomAnchor).isActive = true

        title.addSubview(leftLabel)
        leftLabel.text = "left"
        leftLabel.translatesAutoresizingMaskIntoConstraints = false
        leftLabel.topAnchor.constraint(equalTo: title.topAnchor).isActive = true
        leftLabel.leadingAnchor.constraint(equalTo: self.leadingAnchor).isActive = true
        leftLabel.trailingAnchor.constraint(lessThanOrEqualTo: title.leadingAnchor).isActive = true
        leftLabel.bottomAnchor.constraint(equalTo: title.bottomAnchor).isActive = true
    }

    button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
}

func buttonTapped() {
    print("button tapped")
}