Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Animate UIView height when using auto layout with swift

Before Auto-layout, I've been animating a background's height in a project by setting the frame over animateWithDuration.

func setUpBackground() {
    self.backgroundView.frame = CGRect(x: 0, y: 0, width: 320, height: 10)
    self.backgroundView.backgroundColor = UIColorFromRGB(0x2d2d2d).CGColor
}

func AnimateBackgroundHeight() {
    UIView.animateWithDuration(0.5, animations: {
        self.backgroundView.frame = CGRect(x: 0, y: 0, width: 320, height: 600)    
    })
}

After I converted my project to auto layout, I noticed that the animation occurs but the background height snaps back to the original size/style (interface builder setting) after. I read that when Auto-layout is turned on, the constraints will overwrite setting the UIView dimensions with CGRect.

Therefore I'm wondering how to go about achieving the same height change animation effect with Auto-layout ON.

like image 399
Poyi Avatar asked Mar 25 '15 05:03

Poyi


2 Answers

Give your backgroundView a height constraint, and make an IBOutlet to it. In code, modify the constraint's constant value.

func AnimateBackgroundHeight() {
    UIView.animateWithDuration(0.5, animations: {
         self.heightCon.constant = 600 // heightCon is the IBOutlet to the constraint
         self.view.layoutIfNeeded()    
    })
}
like image 68
rdelmar Avatar answered Nov 10 '22 02:11

rdelmar


Also for those of you who find this post trying to figure out why a transition changing a view's size will be blocky or unclean you just need to find the view in charge and call self.view.layoutIfNeeded() inside of the UIView.animateWithDuration block. I was banging my head against the wall trying different things with constraints and making frames until realizing that self.view.layoutIfNeeded() will handle making the transition smooth as long as you are placing it in the right location.

like image 7
Sethmr Avatar answered Nov 10 '22 01:11

Sethmr