iOS：如何为新的自动布局约束（高度）设置动画答案

【问题标题】：iOS: How does one animate to new autolayout constraint (height)iOS：如何为新的自动布局约束（高度）设置动画
【发布时间】：2012-10-29 01:46:31
【问题描述】：

我以前从未使用过 autolayout 约束。我有一个正在开发的小型新应用程序，并注意到 NIB 的视图默认为自动布局。所以，我想我会借此机会与一起工作，并尝试弄清楚 Apple 的发展方向。

第一个挑战：

我需要调整 MKMapView 的大小，并且想将其动画到新位置。如果我按照我习惯的方式这样做：

[UIView animateWithDuration:1.2f
     animations:^{
         CGRect theFrame = worldView.frame;
         CGRect newFrame = CGRectMake(theFrame.origin.x, theFrame.origin.y, theFrame.size.width, theFrame.size.height - 170);
         worldView.frame = newFrame;
}];

...然后，每当兄弟视图更新时，MKMapView 将“快速”恢复到其原始高度（在我的情况下，UISegmentedControl 的标题正在更新[myUISegmentedControl setTitle:newTitle forSegmentAtIndex:0]）。

所以，我认为我想要做的是将 MKMapView 的约束从等于父视图的高度更改为相对于 UISegmentedControl 的顶部 /em> 覆盖：V:[MKMapView]-(16)-[UISegmentedControl]

我想要的是缩短 MKMapView 的高度，以便显示地图视图下方的一些控件。为此，我认为我需要将约束从固定的全尺寸视图更改为底部被约束到 UISegmentedControl 顶部的约束......并且我希望它作为视图进行动画处理缩小到新尺寸。

这是怎么做的？

编辑 - 这个动画不是动画虽然视图的底部确实立即向上移动了 170：

    [UIView animateWithDuration:1.2f
         animations:^{
             self.nibMapViewConstraint.constant = -170;

    }];

nibMapViewConstraint 在 IB 中连接到底部垂直空间约束。

【问题讨论】：

我知道您可以在 [UIView animateWithDuration..] 块中轻松更改约束的常量值以动画化高度变化。您需要为该约束创建一个 IBOutlet 并将其连接到您的 xib 中，或者如果您在代码中创建它，则保留对它的引用（或遍历所有约束以查找它）。不知道如何为相关更改设置动画，但我读过你应该只更改常量而不是约束的其他值（对于其他值，创建一个新的约束）。
嗯。以为我可以，但我不是动画。它成功更改并位于动画块中，但没有动画！？！
在这里找到我的答案：stackoverflow.com/questions/12926566/…>
别忘了[view layoutIfNeeded]，那也是我的问题哈哈。这与解决我的问题的问题相同。
How do I animate constraint changes?的可能重复

标签： ios uiview autolayout nslayoutconstraint

【解决方案1】：

无需使用更多的IBOutlet reference 约束来代替这个，您可以直接使用access 或update 已应用的约束，由Programmatically 或Interface Builder 使用KVConstraintExtensionsMaster 库在任何视图上应用.该库还管理NSLayoutConstraint 的Cumulative 行为。

在 containerView 上添加高度约束

 CGFloat height = 200;
 [self.containerView applyHeightConstrain:height];

用动画更新containerView的高度约束

[self.containerView accessAppliedConstraintByAttribute:NSLayoutAttributeHeight completion:^(NSLayoutConstraint *expectedConstraint){
        if (expectedConstraint) {
            expectedConstraint.constant = 100;

            /* for the animation */ 
            [self.containerView  updateModifyConstraintsWithAnimation:NULL];
      }
    }];

【讨论】：

【解决方案2】：

大多数人使用自动布局在他们的视图上布局项目并修改布局约束以创建动画。

无需大量代码即可实现此目的的一种简单方法是在 Storyboard 中创建您想要制作动画的 UIView，然后在您希望 UIView 结束的地方创建一个隐藏的 UIView。您可以使用 xcode 中的预览来确保两个 UIView 都在您想要的位置。之后，隐藏结束 UIView 并交换布局约束。

如果您不想自己编写，有一个名为 SBP 的用于交换布局约束的 podfile。

Here's a tutorial.

【讨论】：

【解决方案3】：

这对我有用（iOS7 和 iOS8+）。单击您要调整的自动布局约束（在界面构建器中，例如顶部约束）。接下来将其设为 IBOutlet；

@property (strong, nonatomic) IBOutlet NSLayoutConstraint *topConstraint;

向上动画；

    self.topConstraint.constant = -100;    
    [self.viewToAnimate setNeedsUpdateConstraints]; 
    [UIView animateWithDuration:1.5 animations:^{
        [self.viewToAnimate layoutIfNeeded]; 
    }];

动画回到原来的地方

    self.topConstraint.constant = 0;    
    [self.viewToAnimate setNeedsUpdateConstraints];  
    [UIView animateWithDuration:1.5 animations:^{
        [self.viewToAnimate layoutIfNeeded];
    }];

【讨论】：

哇！！这实际上确实有效！这个答案让我大开眼界。非常感谢你！ -- 埃里克
@ErikvanderNeut 它也适合我，很高兴它有帮助。从现在开始，我将动画约束而不是帧位置。
不要错过添加：[containerView layoutIfNeeded];它确保在 animateWithDuration 块之前完成所有待处理的布局操作。

【解决方案4】：

更新约束后：

[UIView animateWithDuration:0.5 animations:^{[self.view layoutIfNeeded];}];

将self.view 替换为对包含视图的引用。

【讨论】：

适用于视图本身，但是对该视图有约束的视图会立即移动。我该怎么办？ ty
如果需要，您还需要在这些视图上调用布局。但是它并不能真正正常工作，因为这也会为视图刷新设置动画。您如何仅在其他视图中为约束调整设置动画？
注意：如果使用UIViewAnimationOptionBeginFromCurrentState，布局约束将在动画之前设置！
不要为每个视图调用layoutIfNeeded，只需调用[[self.view superview] layoutIfNeeded];
@ngb 你需要改变inside动画块的约束常量。这样约束随着动画的变化而变化，你可以继续使用UIViewAnimationOptionBeginFromCurrentState。

【解决方案5】：

我已经制作了this small demo available。它通过一个非常简单的示例展示了如何更改自动布局约束并为其设置动画。只需看看DemoViewController.m。

【讨论】：

【解决方案6】：

苹果本身有一个非常好的教程，解释了如何使用带有自动布局的动画。关注这个link，然后找到名为“Auto layout by example”的视频它提供了一些关于自动布局的有趣内容，最后一部分是关于如何使用动画。

【讨论】：