Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Animating UIView frame with constraints

I have an element in a UIView with a constraint that says it should always be 10 pixels from the bottom of the view. I am then attempting to animate this view's height so that it appears to slide down the screen. According to the constraint, the element should always be 10 pixels from the bottom of the view. This holds true when I add the view like so...

printView *vc = [self.storyboard instantiateViewControllerWithIdentifier:@"printView"];
    [self addChildViewController:vc];
    vc.view.frame = CGRectMake(0, 60, vc.view.frame.size.width, HEIGHT);
    vc.view.layer.masksToBounds = FALSE;
    [vc.view.layer setShadowOffset:CGSizeMake(0.0, 5.0)];
    [vc.view.layer setShadowOpacity:0.8];
    vc.view.layer.shadowColor = [[UIColor blackColor] CGColor];
    vc.view.layer.shadowRadius = 8;
    vc.view.clipsToBounds = TRUE;
    [self.view insertSubview:vc.view aboveSubview:docWebView];

I can change HEIGHT to whatever I want and the element is always 10 pixels from the bottom of the view. The problem comes when I try to animate the height

printView *vc = [self.storyboard instantiateViewControllerWithIdentifier:@"printView"];
    [self addChildViewController:vc];
    vc.view.frame = CGRectMake(0, 60, vc.view.frame.size.width, 0);
    vc.view.layer.masksToBounds = FALSE;
    [vc.view.layer setShadowOffset:CGSizeMake(0.0, 5.0)];
    [vc.view.layer setShadowOpacity:0.8];
    vc.view.layer.shadowColor = [[UIColor blackColor] CGColor];
    vc.view.layer.shadowRadius = 8;
    vc.view.clipsToBounds = TRUE;
    [self.view insertSubview:vc.view aboveSubview:docWebView];
    [UIView animateWithDuration:5.0 animations:^{
        vc.view.frame = CGRectMake(0, 60, vc.view.frame.size.width, 200);
        [self.view setNeedsDisplay];
    }];

The constraint is no longer honored and instead of the view sliding in with the element always 10 pixels from the bottom, it looks like the element is being uncovered because the element does not move with the view. I hope I am explaining this well enough. To put it another way, I'm going for the effect of a map being pulled down, but instead it looks like the map is already there and a piece of paper that is covering it is being pulled away. Thanks for your help.

like image 511
davis Avatar asked Jul 13 '13 03:07

davis


1 Answers

When using constraints, you shouldn't be setting frames, you should be adjusting the constraints. When you initially set up your constraints, you should make an IBOutlet to the height constraint, and then animate its constant parameter in the animation block. If you had a height constraint called heightCon, you could do this:

[UIView animateWithDuration:5.0 animations:^{
        self.heightCon.constant = 200
        [self.view layoutIfNeeded];
    }];

I'm not sure about your structure, that self.view might have to be vc.view instead.

After Edit:

This is the way to animate a height constraint, but I'm not sure that's what you want to do to accomplish the look you're after. I'm not really sure what to make of your last paragraph. If you're going for an effect of a map being pulled down, it seems like the bottom constraint needs to be either animated or eliminated.

like image 110
rdelmar Avatar answered Nov 02 '22 00:11

rdelmar