titanPlanet12
titanPlanet12

Reputation: 35

Changing color of uibutton

I am trying to create a UIbutton that changes color to green when tapped and blue when deselected. My logic works however when I exit the screen it still shows blue when selected because it's the default color shown before the button is tapped. What can I do to resolve this ?

func setUpSelectDealerButton(){
    selectDealerButton.layer.cornerRadius = 5
    view.addSubview(selectDealerButton)
    selectDealerButton.setTitle( "Select Dealer" , for: .normal)
    selectDealerButton.backgroundColor = .systemBlue
    
    selectDealerButton.snp.makeConstraints{ (make) in
        make.bottom.equalTo(view.safeAreaLayoutGuide.snp.bottom).offset(-16)
        make.top.equalTo(view.safeAreaLayoutGuide.snp.bottom).offset(16)
        
        make.leading.equalTo(view.safeAreaLayoutGuide.snp.leading).offset(3)
        make.trailing.equalTo(view.safeAreaLayoutGuide.snp.trailing).offset(-3)
        make.height.equalTo(50)
        make.width.equalTo(50)
    }
    selectDealerButton.addTarget(self, action: #selector(addToSelectedAccounts), for: .touchUpInside)
}

@objc func addToSelectedAccounts() {
    if let selectedAccounts = delegate?.selectedAccounts, !selectedAccounts.contains(viewModel.account) {
        delegate?.didSelect(account: viewModel.account)
    }
    
    if selectDealerButton.isSelected{
       selectDealerButton.isSelected = false
       selectDealerButton.setTitle( "Select Dealer" , for: .normal)
       selectDealerButton.backgroundColor = .systemBlue
    }
    else{
        selectDealerButton.isSelected = true
        selectDealerButton.setTitle( "Dealer Selected" , for: .normal)
        selectDealerButton.backgroundColor = .systemGreen
        GlobalMBProgressHud.sharedInstance.showGlobalHud(withSuccess: true, text: "Selected!")
    }
}

This is the screenshot: https://postimg.cc/xJt8ngy9

Upvotes: 1

Views: 75

Answers (1)

Fabio
Fabio

Reputation: 5648

If I understand well this is an example of how to control button state, declare your objects:

let myButton: UIButton = {
    let button = UIButton(type: .system)
    button.layer.cornerRadius = 5
    button.clipsToBounds = true
    button.setTitleColor(.white, for: .normal)
    button.translatesAutoresizingMaskIntoConstraints = false
    return button
}()

let myLabel: UILabel = {
    let label = UILabel()
    label.textColor = .white
    label.textAlignment = .center
    label.font = .systemFont(ofSize: 20, weight: .semibold)
    label.translatesAutoresizingMaskIntoConstraints = false
    return label
}()

var buttonState = Int() // set to integer

in viewDidLoad add target to your button set constraints (how you prefer) and call handleChangeButton function:

view.backgroundColor = .red

let control = UserDefaults.standard.integer(forKey: "buttonState")
    if control == 0 {
        buttonState = 0
    } else {
        buttonState = control
    }

myButton.addTarget(self, action: #selector(handleChangeButton), for: .touchUpInside)
    
view.addSubview(myButton)
myButton.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -10).isActive = true
myButton.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor, constant: 10).isActive = true
myButton.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor, constant: -10).isActive = true
myButton.heightAnchor.constraint(equalToConstant: 50).isActive = true
    
view.addSubview(myLabel)
myLabel.leadingAnchor.constraint(equalTo: myButton.leadingAnchor).isActive = true
myLabel.trailingAnchor.constraint(equalTo: myButton.trailingAnchor).isActive = true
myLabel.heightAnchor.constraint(equalToConstant: 50).isActive = true
myLabel.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
    
handleChangeButton()

set variable to control button state and write the function:

@objc fileprivate func handleChangeButton() {
    if buttonState == 0 {
        myButton.setTitle( "Select Dealer" , for: .normal)
        myButton.backgroundColor = .systemBlue
        myLabel.text = myButton.currentTitle
        buttonState = 1
    } else {
        myButton.setTitle( "Dealer Selected" , for: .normal)
        myButton.backgroundColor = .systemGreen
        myLabel.text = myButton.currentTitle
        buttonState = 0
    }
    UserDefaults.standard.set(buttonState, forKey: "buttonState")
}

This is the result:

enter image description here

Upvotes: 1

Related Questions