Animating/Moving views under usage of Autolayout

Question

I want to move a view from one postion to another, I can implement it using

self.view.center = CGPointMake(100, 200); 

however, if the project is using Autolayout, then the view will be back to original position after running:

[self.view.superview setNeedsLayout]; 

then how to actually move a view to new position?

Answer 1

With AutoLayout enabled, we should FORGET FRAMES and only CONSIDER CONSTRAINTS.Yes, for animating also you can no longer change the frame or center, view's will revert back to their original position when layout is called.

Instead you should consider changing the constant value of the constraint to get the same effect.

Consider a User Interface like the image given below.I have a image view with a 20 points leading space from it's superview that means it has a horizontal space constraint with it's superview.Also I have three more constraints attached to that image view, top, width and height.

I will show you how we can animate the image from left to right as shown in the image.

Create IBOutlet's for the constraint's we need to animate.Here we are taking only horizontal space constraint, that is enough to move this view from the left to right.

@property (weak, nonatomic) IBOutlet UIImageView *imageView; @property (weak, nonatomic) IBOutlet NSLayoutConstraint *horizontalSpaceConstraint; 

Inside Go Away action, we need to update the constant value of this constraint.

- (IBAction)moveFrontAction:(id)sender {     self.horizontalSpaceConstraint.constant = 220;      [UIView animateWithDuration:0.5 animations:^{          [self.imageView layoutIfNeeded];     }]; } 

Now the view should be moved to the right end.I'm just doing that inside a animation block so we will be able to see a nice animation from left to right and vice versa.In Production, we should not hard code the values like this.Just doing it here to make the concept clear.

Inside the Come Back action, we are again resetting the constant back to it's original value, so you can see the orange image animating back to the original location.

- (IBAction)moveBackAction:(id)sender {     self.horizontalSpaceConstraint.constant = 20;      [UIView animateWithDuration:0.5 animations:^{         [self.imageView layoutIfNeeded];     }]; } 

Answer 2

You must change the constraints if you are using autoLayout. The way that is suggested is to make an outlet in your view controller of the constraint, then you change the constant of the constraint. If you have the time i would definitely recommend going here and watching "Auto Layout by Example" or "Best Practices for Mastering Auto Layout". They helped me out a lot. I guess the point to take away is that with autoLayout, you no longer think in terms of frames. So setting the center just doesnt work with auto layout. It's all about how views are related to each other.