programmatically set a button width and height

Question

I would like to programmatically customize the UIButton. My code starts here:

class MyButton: UIButton {
    override func awakeFromNib() {
        super.awakeFromNib()

        layer.shadowRadius = 5.0
        ...
    }
}

Now I would like to define a constant width and height for the button, how to do it in code?

Solution 1

I would recommend to use autolayout:

class MyButton: UIButton {
    override func awakeFromNib() {
        super.awakeFromNib()

        layer.shadowRadius = 5.0

        // autolayout solution
        self.translatesAutoresizingMaskIntoConstraints = false
        self.widthAnchor.constraint(equalToConstant: 200).isActive = true
        self.heightAnchor.constraint(equalToConstant: 35).isActive = true
    }
} 

Solution 2

You need to override override init(frame: CGRect) method

class MyButton: UIButton {

    override init(frame: CGRect) {
        super.init(frame: frame)
        // Set your code here

        let width = 300
        let height = 50
        self.frame.size = CGSize(width: width, height: height)

        backgroundColor = .red
        layer.shadowRadius = 5.0
    }

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

Solution 3

If your button is having constraints set from the storyboard as below and you want to change the width of the button, then this answer is helpful.

constraints set from the storyboard

Safe Area.trailing = Button.trailing + 20
Button.leading = Safe Area.leading + 20
Safe Area.bottom = Button.bottom + 20
height = 40
    

see the image for a better understanding.

Requirement :

if #condition 1 gets satisfied, then change button width to 100 or any width dimension.

else

if #condition 2 gets satisfied, then keep width as it is ( as per given constraints)

To handle this,

1. Create an IBOutlet of leading and trailing constraints of that button.
2. Set it to inactive.
3. Add width anchor for the button programmatically.

Setting it inactive is mandatory because both won't work at the same time, so be careful.

@IBOutlet weak var btnNextTrailingConstraint: NSLayoutConstraint!
@IBOutlet weak var btnNextLeadingConstraint: NSLayoutConstraint!

if (condition1) {
  btnNextLeadingConstraint.isActive = false
  btnNextTrailingConstraint.isActive = false
  btnNext.widthAnchor.constraint(equalToConstant: 100).isActive = true
 }
 else {
   btnNextLeadingConstraint.isActive = true
   btnNextTrailingConstraint.isActive = true
 }


  

swift ios autolayout constraints

Solution 4

I tried finding a way to create a square button box. Hope I`m not at the wrong place here, but when I tried to find my own solution it was as easy as this:

button.frame.size.width = 200
button.frame.size.height = 200

And this works of course with all the other views.

View more solutions