ios - 将自动布局与核心动画相结合

Question

我是核心动画的新手，我正在努力解决一件事 - 如何将自动布局与核心动画相结合。其实我在Core Animation的文档里只找到一句话提到Autolayout here is it

Remember to Update View Constraints as Part of Your Animation If you are using constraint-based layout rules to manage the position of your views, you must remove any constraints that might interfere with an animation as part of configuring that animation. Constraints affect any changes you make to the position or size of a view. They also affect the relationships between the view and its child views. If you are animating changes to any of those items, you can remove the constraints, make the change, and then apply whatever new constraints are needed.

但正如我所尝试的那样，一切都不像看起来那么简单。这是我的场景。

我设计了一个广泛使用自动布局的滑动菜单。这是该 View 的外观。

我正在使用自动布局约束来强制按比例定位滑动菜单中的这些项目。实际上那里有很多限制，我不想在我的问题中发布所有这些限制，甚至可能不需要直接回答这个问题，但是如果你需要它们，我可以用这些更新帖子约束条件。

您在 gif 中看到的动画仅通过自动布局实现。我只是在滑动菜单的高度约束中添加了 outlet 并更改为这样:(代码是使用 Xamarin Monotouch 编写的，但我相信纯 iOS 开发人员应该清楚这里做了什么)

private void AnimateSlideMenuAppearance()
    {
        float height;
        if (isSlideMenuShown) {
            height = 0;
        } else {
            height = slideMenuHeight;
        }
        UIView.Animate (0.4,
            delegate {
                this.slideMenuHeightConstraint.Constant = height;
                this.View.LayoutIfNeeded ();
            }, 
            delegate {
                isSlideMenuShown = !isSlideMenuShown;
            });
    }

现在我想要更复杂的外观过渡。 CLICK HERE看看我想要达到的效果。

只是为了尝试，我尝试使用一系列 CABasicAnimation 实现该动画的消失部分，但没有成功，我得到了奇怪的行为。

有人可以建议我在这里应该做什么吗？是否可以使用自动布局来计算 View 的位置，但以某种方式覆盖自动布局大小更改之间的动画？我的意思是在我的具体示例中，我需要向它们添加 FadeOut 动画，而不是按比例减小菜单中所有按钮的大小，将边界设置为零，并从根本上增加按钮之间动画的开始时间以获得效果我想要的。或者我可能需要完全摆脱自动布局并手动计算尺寸和动画？

在这种情况下，最佳实践是什么 - 当您有复杂的自动布局并且需要在自动布局更改之间自定义 Core Animation 转换时？我希望我很好地描述了这个问题。感谢您的回答。

Answer 1

这是完全可行的，虽然它可能很复杂，因为它看起来像您想要的案例将有多个动画。

但是，我注意到您的代码中有一件事很奇怪:您更改了约束上的常量 (this.slideMenuHeightConstraint.Constant = height)在 动画 block 中，而不是在它之前。对于我能想到的几乎所有情况，您都应该在动画 block 之前更改约束。直到下一个 UI 运行循环(或通过 setNeedsUpdateConstraints 将其强制用于下一个运行循环)或立即通过 layoutIfNeeded 时，约束才会在视觉上呈现。由于 [UIView animate:...] 正在为您执行此操作，因此 layoutIfNeeded 应该(通常)是您的动画 block 中的 唯一 , 在为自动布局设置动画时。

在您的情况下，您必须使动画有点 react 性，但是 - 例如，如果您想要像示例中那样添加这些按钮并让它们弹出、动画出来和增长。调用 layoutIfNeeded 后，您可以安全地检查帧大小。如果它超出了您的阈值(或其他一些指标)，您可以触发按钮的动画。 (所以是的，这可能是我要在动画 block 中添加更多代码的情况——检查阈值、开始其他动画等)。