Adding a subview and position it with constraints programmatically
Solution 1
I'm pretty sure you need to also set:
label.setTranslatesAutoresizingMaskIntoConstraints(false)
Otherwise I don't think the constraints will apply to the label.
Solution 2
Note for Swift 2/3
It has changed to Boolean property: UIView.translatesAutoresizingMaskIntoConstraints
Instead of it previously being:
label.setTranslatesAutoresizingMaskIntoConstraints(false)
It is now:
label.translatesAutoresizingMaskIntoConstraints = false
Solution 3
You need to do this for each UIControl to assign NSConstraints
label.translatesAutoresizingMaskIntoConstraints = false
Isuru
Started out as a C# developer. Turned to iOS in 2012. Currently learning SwiftUI. Loves fiddling with APIs. Interested in UI/UX. Want to try fiddling with IoT. Blog | LinkedIn
Updated on July 05, 2022Comments
-
Isuru almost 2 years
I have added a
UIView
using the IB on to the view controller. Let's call it theredView
.Then I have pinned its all four sides using auto layout constraints in code and when I run it, it looks like this as expected.
Now I want to add a
UILabel
to this view programmatically and position it in the center using auto layout constraints.Below is the code I have so far.
import UIKit class ViewController: UIViewController { @IBOutlet private var redView: UIView! override func viewDidLoad() { super.viewDidLoad() redView.setTranslatesAutoresizingMaskIntoConstraints(false) let leadingConstraint = NSLayoutConstraint(item: redView, attribute: .Leading, relatedBy: .Equal, toItem: view, attribute: .Leading, multiplier: 1, constant: 0) let trailingConstraint = NSLayoutConstraint(item: redView, attribute: .Trailing, relatedBy: .Equal, toItem: view, attribute: .Trailing, multiplier: 1, constant: 0) let topConstraint = NSLayoutConstraint(item: redView, attribute: .Top, relatedBy: .Equal, toItem: view, attribute: .Top, multiplier: 1, constant: 0) let bottomConstraint = NSLayoutConstraint(item: redView, attribute: .Bottom, relatedBy: .Equal, toItem: view, attribute: .Bottom, multiplier: 1, constant: 0) view.addConstraints([leadingConstraint, trailingConstraint, topConstraint, bottomConstraint]) let label = UILabel() label.text = "Auto Layout Exercise" redView.addSubview(label) let xCenterConstraint = NSLayoutConstraint(item: label, attribute: .CenterX, relatedBy: .Equal, toItem: redView, attribute: .CenterX, multiplier: 1, constant: 0) let yCenterConstraint = NSLayoutConstraint(item: label, attribute: .CenterY, relatedBy: .Equal, toItem: redView, attribute: .CenterY, multiplier: 1, constant: 0) let leadingConstraint1 = NSLayoutConstraint(item: label, attribute: .Leading, relatedBy: .Equal, toItem: redView, attribute: .Leading, multiplier: 1, constant: 20) let trailingConstraint1 = NSLayoutConstraint(item: label, attribute: .Trailing, relatedBy: .Equal, toItem: redView, attribute: .Trailing, multiplier: 1, constant: -20) redView.addConstraints([xCenterConstraint, yCenterConstraint, leadingConstraint1, trailingConstraint1]) } }
The problem is the label doesn't appear on the
redView
. Can anyone please tell me what I'm missing here?Thank you.