利用Constraint给Storyboard添加动画

自从使用Storyboard后，感觉添加动画变的操作好复杂，以前只要几行代码可以搞定的事情，到了Storyboard时代，变成了拖来拖去的操作，复杂的界面想加个动画有时还觉得无从下手，下面介绍的一个动画操作很简单，利用Constraint的优先级来设置动画，这个是这篇文章的核心。

首先展示下动画效果

amimate.gif

好了，我们开始一步步实现这个动画

首先拖动2个View到ViewController上，设置各自的约束，然后拖一个UISwitch放在界面下方，方便控制动画

红色View的约束如下

Paste_Image.png

蓝色View的约束如下：

Paste_Image.png

现在我们需要红色的View可以扩充到全屏，那么接下来我们需要添加一个约束，就是红色View到父View的右侧约束

Paste_Image.png

再设置下约束的优先级为High

Paste_Image.png

接下来我们需要降低蓝色View的右侧约束的优先级，这样才可以让红色View可以扩充到父View

Paste_Image.png

同样设置优先级成High

Paste_Image.png

然后把这个2个约束都拖到代码里面

@IBOutlet weak var redViewToViewConstraint: NSLayoutConstraint!
@IBOutlet weak var blueViewTrailingConstraint: NSLayoutConstraint!

接下来设置动画，我们需要将红色View右侧约束变成0，同时需要降低蓝色View右侧约束的优先级

这里有个示意图，大致画了一下，大家随便看看下吧

Paste_Image.png

func updateConstraintsForMode(isOn : Bool)
 {
    if (isOn) {
      self.redViewToViewConstraint.constant = 0
      self.blueViewTrailingConstraint.priority = UILayoutPriorityDefaultHigh - 1
    } else {
      self.blueViewTrailingConstraint.priority = UILayoutPriorityDefaultHigh + 1
    }
 }

最后将UISwitch的Action拖进代码，加上启用动画代码，就完成啦

@IBAction func switchAction(sender: UISwitch) {
    updateConstraintsForMode(sender.on)
    UIView.animateWithDuration(1.0) { () -> Void in
      self.view.layoutIfNeeded()
    }
 }

Demo代码在这里