Where to add Auto Layout constraints code within a custom UIView

Question

I often see Auto Layout constraints being added in the UIViewController but to me that seems to be the wrong place for layout logic.

Is it possible to add NSLayoutConstraints within a custom UIView?

Where in a UIView would be the right place to add them programmatically?

Answer 1

Is it possible to add NSLayoutConstraints within a custom UIView?

Yes it is possible to add constraints within a custom view, organization is very important here, especially if you want to animate parts of your custom view.

Read the subclassing section from Apple's UIView Reference document

Constraints:

requiresConstraintBasedLayout - Implement this class method if your view class requires constraints to work properly.

updateConstraints - Implement this method if your view needs to create custom constraints between your subviews.

alignmentRectForFrame:, frameForAlignmentRect: - Implement these methods to override how your views are aligned to other views.

Where in a UIView is the right place to add them programmatically?

Here is a skeleton outline of a custom class. The key concern is that you centralize your constraints otherwise the class become very messy the more constraints you add. Also you can introduce other settings in the updateConstraints() method and conditionally add or remove constraints by setting your configuration values and then call setNeedsUpdateConstraints().

Any constraints you decide you want to animate should most lightly be instance variables.

Hope this helps :)

class MyCustomView: UIView {      private var didSetupConstraints = false     private let myLabel = UILabel(frame: CGRectZero)      // MARK: Lifecycle     override init(frame: CGRect) {         super.init(frame: CGRectZero)         self.setup()     }      required init?(coder aDecoder: NSCoder) {         super.init(coder: aDecoder)         self.setup()     }       // Mark: - Setup     private func setup() {          // 1. Setup the properties of the view it's self         self.translatesAutoresizingMaskIntoConstraints = false         backgroundColor = UIColor.orangeColor()         clipsToBounds = true          // 2. Setup your subviews         setupMyLabel()          // 3. Inform the contraints engine to update the constraints         self.setNeedsUpdateConstraints()     }       private func setupMyLabel() {          myLabel.translatesAutoresizingMaskIntoConstraints = false      }       override func updateConstraints() {          if didSetupConstraints == false {             addConstraintsForMyLabel()         }          super.updateConstraints() //Documentation note: Call [super updateConstraints] as the final step in your implementation.     }      private func addConstraintsForMyLabel() {          // Add your constraints here     }  }