Question

如何在使用UIView的关键帧动画时设置动画曲线：

animateKeyframesWithDuration:delay:options:animations:completion:

无论我在动画块中做什么似乎都是线性的（除非我使用UIViewKeyframeAnimationOptionCalculationModeCubic选项，但这不是我想要的。）

在使用常规动画时，我想在动画上设置一个缓出曲线，如UIViewAnimationOptionCurveEaseOut选项：

animateWithDuration:delay:options:animations:completion:

Answer 1

Swift 2.0 不允许将UIViewAnimationOptions转换为UIViewKeyframeAnimationOptions。它也不允许|将它们组合在一起。

但是，UIViewKeyframeAnimationOptions的初始化程序需要rawValue。因此，以下代码可以将UIViewAnimationOptions放入UIViewKeyframeAnimationOptions：

let animationOptions: UIViewAnimationOptions = .CurveEaseOut
let keyframeAnimationOptions: UIViewKeyframeAnimationOptions = UIViewKeyframeAnimationOptions(rawValue: animationOptions.rawValue)

然后我可以将keyframeAnimationOptions传递给animateKeyframesWithDuration，一切正常。

Answer 2

实际上，您可以使用与animateWithDuration相同的曲线标志：delay：options：animations：completion：。只需“二进制”或“与animateKeyframesWithDuration调用中的其他选项”：delay：options：animations：completion：

文档令人困惑，但确实有效。

您可以使用的曲线值为：

UIViewAnimationOptionCurveEaseInOut = 0 << 16,
UIViewAnimationOptionCurveEaseIn    = 1 << 16,
UIViewAnimationOptionCurveEaseOut   = 2 << 16,
UIViewAnimationOptionCurveLinear    = 3 << 16,

您获得的默认动画曲线是0，或者是缓入，缓出。

Answer 3

这是我提出的一个漂亮而干净的Swift解决方案：

extension UIViewKeyframeAnimationOptions {

    init(animationOptions: UIViewAnimationOptions) {
        rawValue = animationOptions.rawValue
    }

}

用法：

UIViewKeyframeAnimationOptions(animationOptions: .CurveEaseOut)

Answer 4

在尝试将曲线设置为linear的 animateKeyframes(withDuration:delay:options:animations:completion:) 时，@ eskimwier的答案对我不起作用。这是在Swift 3，Xcode 8.2.1中。

我的动画似乎默认为easeInOut（启动慢，中间更快，结尾慢）。 Apple是否更改了默认曲线？

无论如何，我想要一个线性曲线，并尝试使用上面建议的方法将UIViewAnimationOptions用于关键帧动画：

let animationOptions: UIViewAnimationOptions = .curveLinear
var keyframeAnimationOptions: UIViewKeyframeAnimationOptions = UIViewKeyframeAnimationOptions(rawValue: animationOptions.rawValue)

UIView.animateKeyframes(withDuration: 3, delay: 0, options: [keyframeAnimationOptions], animations: {
    //... animations here ...
}, completion: nil)

这没有效果。唯一对我有用的是在调用animateKeyframes之前执行此操作：

UIView.setAnimationCurve(UIViewAnimationCurve.linear)

Answer 5

如果使用关键帧，则必须自己定义曲线。如果添加线性关键帧，则会有线性动画。如果添加非线性关键帧，则会有非线性动画。

frameStartTime在这里是你的朋友......它在关键帧之间总是线性的（或节奏/立方/立方节奏，如UIViewKeyframeAnimationOptionCalculationMode中定义的那样）

UIViewKeyframeAnimationOptionCalculationModeLinear     = 0 << 9,
UIViewKeyframeAnimationOptionCalculationModeDiscrete   = 1 << 9,
UIViewKeyframeAnimationOptionCalculationModePaced      = 2 << 9,
UIViewKeyframeAnimationOptionCalculationModeCubic      = 3 << 9,
UIViewKeyframeAnimationOptionCalculationModeCubicPaced = 4 << 9

要计算正确的计时值，您可以将其用作参考： RBBEasingFunction

E.g。像EaseInOutQuad这样（其中t是动画中的相对时间）：

if (t < 0.5) {
    return 2 * t * t;
} else {
    return -1 + (4 - 2 * t) * t;
}

Answer 6

设置关键帧动画的动画曲线的一种简单方法是将关键帧动画包装在UIViewPropertyAnimator对象内：

let animator = UIViewPropertyAnimator(duration: 0.5, curve: .linear) {

    // withDuration: 0 means inherited duration from UIViewPropertyAnimator
    UIView.animateKeyframes(withDuration: 0, delay: 0, animations: {
        UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration:0.5) {
            // modify view's properties
        }

        // more keyframes
    })
}

animator.startAnimation()

在ios中使用关键帧动画时如何设置动画曲线？

6 个答案: