How can I center a UIView programmatically on top of an existing UIView using Autolayout?

Question

In case of a successful Foursquare checkin, my iPhone app shows adds a view on top of the view which is shown.

I want the view to be centered on the X and Y and for it to have a definite width and height using autolayout, but I'm not sure which constraints to add programmatically. I know how to do it in Storyboard, but I'm not sure what exactly to type in code to do the same as this view is added later in response to a successful action in the app.

I can't get it working properly and the UIView has a nib which it loads with loadNibNamed:.

SuccessView *successfulCheckInView = [[SuccessView alloc] initWithFrame:CGRectZero];
successfulCheckInView.placeNameLabel.text = properVenue.name;
successfulCheckInView.placeAddressLabel.text = properVenue.address;
successfulCheckInView.delegate = self;

[self.ownerVC.view addSubview:successfulCheckInView];

Solution

Try this:

NSLayoutConstraint *xCenterConstraint = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:view2 attribute:NSLayoutAttributeCenterX multiplier:1.0 constant:0];
[superview addConstraint:xCenterConstraint];

NSLayoutConstraint *yCenterConstraint = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:view2 attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0];
[superview addConstraint:yCenterConstraint];

Updated for Swift:

NSLayoutConstraint(item: view1, attribute: .centerX, relatedBy: .equal, toItem: view2, attribute: .centerX, multiplier: 1, constant: 0).isActive = true

NSLayoutConstraint(item: view1, attribute: .centerY, relatedBy: .equal, toItem: view2, attribute: .centerY, multiplier: 1, constant: 0).isActive = true

Comments

[Lucas]

what's view1 and view2?

[Eric]

The order of the relationship does not matter in the case that we are just aligning the views' centers. view1 and view2 are just the different views that you are aligning.

[Charlie Seligman]

if the order doesnt matter, how do we make sure e.g. view1 repositions to be center with view2 vs. the other way round?

[Eric]

Would the other way around be different? The two scenarios seem interchangeable to me. Is there a specific case that you can think of when the order would matter?

[Charlie Seligman]

I guess my question is would view1 shift to be centered with view2 or would view2 shift to be centered with view1?

[Eric]

That would depend on the positioning of the views. For example, if view1 has top and leading constraints defined and view2 has no other constraints, view2 would "shift." If they both have conflicting constraints though, things could be more complex with constraint priorities, etc. I would encourage you to just play around in a storyboard and see how things work under different circumstances!

[Brian Ogden]

Do not forget the oh so easy to forget view1.translatesAutoresizingMaskIntoConstraints = false