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

Posted 2023-03-21

【中文标题】如何在 UIButton 的标签子视图上设置 alpha

【英文标题】：How to set alpha on UIButton's label subviews

【发布时间】：2017-06-07 18:40:16

【问题描述】：

我想以编程方式为我的按钮标题设置多个对齐组合，如下所示： 我发现最简单的方法是添加两个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")

【问题讨论】：

请出示您的代码！

我已经更新了我的答案。请检查

【参考方案1】：

有更好的方法。

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

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

这是输出。

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

停止闪烁：

自定义每个按钮类型。

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

看看这个受欢迎的stack answer.

这是结果。

【讨论】：

我已经尝试了您的方法并使用当前代码更新了原始帖子，但没有奏效。当你说“指向同一个动作”时，你的意思是同一个函数接收两个按钮的 touchUpInside 动作？

虽然这种方法可行，但问题是点击左侧按钮会显示按钮具有的“闪光”动作，但右侧按钮不会，因此如果它们应该看起来有点奇怪像一个按钮一样工作。如果您可以忍受，那么它应该可以正常工作。

确实如此。我需要两个按钮同时具有相同的效果。

使用 UIButtonTypeCustom 停止闪烁。

【参考方案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

【参考方案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")