NSLayoutConstraint animation glitch

Viewed 27

I've decided to switch to constraints and face up with animation problems. In autoresizing mask world everything works fine. UIView is attached to right top. Content inside use autoresizing mask. enter image description here

Animate code:

UIView.animate(withDuration: 0.3, delay: 0, options: [.curveEaseInOut]) {
    self.constraints.first(where: {$0.firstAttribute == .height})?.constant = dstSize.height
    self.constraints.first(where: {$0.firstAttribute == .width})?.constant = dstSize.width
    self.setNeedsLayout()
    self.layoutIfNeeded()
}

enter image description here


Update
Example project github_repo

2 Answers

You need to move constraint's change outside the animation block

self.constraints.first(where: {$0.firstAttribute == .height})?.constant = dstSize.height
self.constraints.first(where: {$0.firstAttribute == .width})?.constant = dstSize.width
UIView.animate(withDuration: 0.5, delay: 0, options: [.curveEaseInOut]) { 
    self.superView!.layoutIfNeeded()
}

Update

In your Github attached code you need to re-layout the main view not the container

UIView.animate(withDuration: 0.5, delay: 0, options: .curveEaseInOut) {
  self.view.layoutIfNeeded()
}

A few things:

  • It's good practice to make properties for the constraints you want to update later;
  • Only the layoutIfNeeded call have to be inside an animation block;
  • It looks like setNeedsLayout is unnecessary. Have you tried to remove it?
Related