iOS: How does one animate to new autolayout constraint (height)

Meltemi picture Meltemi · Nov 8, 2012 · Viewed 79.8k times · Source

I've never worked with autolayout constraints before. I have a small new app I'm working on and noticed that the NIB's views are defaulting to autolayout. So, I figured I'd take the opportunity to work with it and try to figure out where Apple is going with this.

First challenge:

I need to resize an MKMapView and I'd like to animate it to the new position. If I do this the way I'm used to:

[UIView animateWithDuration:1.2f
     animations:^{
         CGRect theFrame = worldView.frame;
         CGRect newFrame = CGRectMake(theFrame.origin.x, theFrame.origin.y, theFrame.size.width, theFrame.size.height - 170);
         worldView.frame = newFrame;
}];

...then the MKMapView will 'snap' back to its original height whenever a sibling view gets updated (in my case a UISegmentedControl's title is being updated [myUISegmentedControl setTitle:newTitle forSegmentAtIndex:0]).

So, what I think I want to do is change the constraints of the MKMapView from being equal to the parent view's hight to being relative to the top of the UISegmentedControl that it was covering: V:[MKMapView]-(16)-[UISegmentedControl]

What I want is for the MKMapView height to shorten so that some controls beneath the map view are revealed. To do so I think I need to change the constraint from a fixed full size view to one where the bottom is constrained to the top of a UISegmentedControl...and I'd like it to animate as view shrinks to new size.

How does one go about this?

Edit - this animation is not animating though the bottom of the view does move up 170 instantly:

    [UIView animateWithDuration:1.2f
         animations:^{
             self.nibMapViewConstraint.constant = -170;

    }];

and the nibMapViewConstraint is wired up in IB to the bottom Vertical Space constraint.

Answer

Ed McManus picture Ed McManus · Mar 13, 2013

After updating your constraint:

[UIView animateWithDuration:0.5 animations:^{[self.view layoutIfNeeded];}];

Replace self.view with a reference to the containing view.