【问题标题】:How to change UIButton border color when button is highlighted (or tapped on) in Swift 3?在 Swift 3 中突出显示(或点击)按钮时如何更改 UIButton 边框颜色?
【发布时间】:2017-01-25 03:36:48
【问题描述】:

这就是我现在所拥有的。想知道在点击或突出显示按钮时如何更改按钮的边框颜色。到目前为止,我只能使用按钮的文本颜色来做到这一点。任何帮助或提示都会很棒,谢谢。

@IBOutlet weak var createNewWorkoutButton: UIButton!

@IBAction func createWorkoutBtn(_ sender: UIButton) {

}

override func viewDidLoad() {
    super.viewDidLoad()

    createNewWorkoutButton.setTitleColor(UIColor .gray, for: UIControlState.highlighted)

    if createNewWorkoutButton = UIControlState.highlighted {
        createNewWorkoutButton.layer.borderColor = UIColor.gray.cgColor
    }

}

【问题讨论】:

    标签: ios mobile uibutton swift3


    【解决方案1】:

    实现此目的的一种方法是为 touchUp 和 touchDown 操作附加目标,如下所示:

    override func viewDidLoad() {
       super.viewDidLoad()
    
       createNewWorkoutButton.setTitleColor(UIColor .gray, for: UIControlState.highlighted)
    
       createNewWorkoutButton.addTarget(self, action: #selector(setButtonSelected(button:)), for: .touchDown);
       createNewWorkoutButton.addTarget(self, action: #selector(setButtonSelected(button:)), for: .touchUpInside);
    
    }
    
    func setButtonSelected(button : UIButton) {
        //layout for selected state
    }
    
    func setButtonUnselected(button : UIButton) {
        //layout for unselected state
    }
    

    【讨论】:

    • 感谢您的输入!
    【解决方案2】:

    您可以为高光状态指定背景图像(边框样式)。例如:

        UIGraphicsBeginImageContext(createNewWorkoutButton.frame.size);
        let context = UIGraphicsGetCurrentContext();
    
        context?.setStrokeColor(UIColor.red.cgColor);
        context?.setLineWidth(1.0);
        context?.stroke(CGRect.init(x: 0, y: 0, width: createNewWorkoutButton.frame.size.width,
                                     height: createNewWorkoutButton.frame.size.height));
        let image = UIGraphicsGetImageFromCurrentImageContext();
    
        UIGraphicsEndImageContext();
    
        createNewWorkoutButton.setBackgroundImage(image, for: UIControlState.highlighted);
    

    【讨论】:

    • 感谢您的意见!
    【解决方案3】:

    如果您只想在触摸 DOWN 时更改颜色并在触摸 UP 时恢复颜色,只需通过子类化 UIButtonisHighlighted /strong> 我认为这是一种更清洁的方法。像这样:

    第一种情况:

         class MyButton: UIButton
        {
            override var isHighlighted: Bool {
                didSet {
                    switch isHighlighted {
                    case true:
                        layer.borderColor = UIColor.blue.cgColor
                        layer.borderWidth = 2
                    case false:
                        layer.borderColor = UIColor.lightGray.cgColor
                        layer.borderWidth = 1
                    }
                }
            }
        }
    

    现在,如果您有很多按钮并且希望用户知道所选按钮,您可以尝试下面的代码,尽管我知道大多数其他方法可以实现这一点,但这是我想出的最快方法. 代码自行解释。

    第二种情况:

        class Something: UIView {
            private lazy var firstButton: UIButton = {
            let btn = UIButton(type: .system)
            btn.addTarget(self, action: #selector(buttonTapped(_:)), for: .touchUpInside)
            return btn
            }()
    
            private lazy var secondButton: UIButton = {
            let btn = UIButton(type: .system)
            btn.addTarget(self, action: #selector(buttonTapped(_:)), for: .touchUpInside)
            return btn
            }()
    
            private lazy var thirdButton: UIButton = {
            let btn = UIButton(type: .system)
            btn.addTarget(self, action: #selector(buttonTapped(_:)), for: .touchUpInside)
            return btn
            }()
    
            @objc
            private func buttonTapped(_ sender: UIButton) {
            let myButtons = [self.firstButton, self.secondButton, self.thirdButton]
    
                for button in vatButtons {
                    // state 1 means the button is on Selected State
                    (button.state.rawValue == 1) ? button.layer.borderColor = UIColor.blue.cgColor : (button.layer.borderColor = UIColor.lightGray.withAlphaComponent(0.5).cgColor)
                }
    
            }
        }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-11-30
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多