使用 UIViewPropertyAnimator 多次重复和反转动画答案

【问题标题】：Repeating and reversing an animation multiple times using UIViewPropertyAnimator使用 UIViewPropertyAnimator 多次重复和反转动画
【发布时间】：2018-08-31 06:27:41
【问题描述】：

我正在尝试让我的动画再次将屏幕从黑色变为白色再变为黑色，并重复一定次数。目前使用代码，我的动画从黑色缓到白色，然后跳回黑色。反正有没有反向运行动画或添加在第一个动画完成后运行的动画？

override func viewDidAppear(_ animated: Bool) {
    let viewColorAnimator: UIViewPropertyAnimator = UIViewPropertyAnimator.runningPropertyAnimator(
        withDuration: 4.0,
        delay: 0.0,
        options: [.curveEaseInOut],
        animations: {
            UIView.setAnimationRepeatCount(3);
            self.lightView.backgroundColor = .white
        })

    viewColorAnimator.startAnimation()
}

我尝试将这段代码添加到项目中，但结果是一样的：

viewColorAnimator.addCompletion {_ in
    let secondAnimator = UIViewPropertyAnimator(duration: 4.0, curve: .linear) {
        self.lightView.backgroundColor = .black
    }
    secondAnimator.startAnimation()
}

编辑：我发现这是因为 setAnimationRepeatCount 因为最后一次迭代工作正常。如何在不重复计数的情况下多次运行动画？

【问题讨论】：

标签： ios swift animation uiviewpropertyanimator

【解决方案1】：

有一种运行动画的简单方法。对于这种方法：如果您希望动画在完成后重复，您可以添加 .autoreverse 和 .repeat 选项。像这样：

UIView.animate(withDuration: TimeInterval(randomTime), delay: 0, options: [.repeat,.autoreverse], animations: {
    //Animation code here
}, completion: {(bool)
   //Do something after completion
})

你可以把你想在动画之后执行的代码放在完成块中。

而且，您可以使用 Timer 作为在特定时间运行动画的一种方式。

【讨论】：

原始海报希望使用 UIViewPropertyAnimator。

【解决方案2】：

Xcode 9.4.1 (Swift 4.1.2) 和 Xcode 10 beta 3 (Swift 4.2)：

这是使用 UIViewPropertyAnimator 的方法——基本上，我们只需将 .repeat 和 .autoreverse 添加到选项中。你已经完成了 99%：

override func viewDidAppear(_ animated: Bool) {
    let viewColorAnimator: UIViewPropertyAnimator = UIViewPropertyAnimator.runningPropertyAnimator(
        withDuration: 4.0,
        delay: 0.0,
        options: [.curveEaseInOut, .repeat, .autoreverse],
        animations: {
            UIView.setAnimationRepeatCount(3)
              self.lightView.backgroundColor = .white
        })

        viewColorAnimator.startAnimation()
    }

【讨论】：

【解决方案3】：

文档说与方向相关的选项被忽略。您可以查看附件here。

实现反向动画：

创建一个动画属性。

private var animator: UIViewPropertyAnimator = {

    let propertyAnimator = UIViewPropertyAnimator.runningPropertyAnimator(
    withDuration: 4.0,
    delay: 0.0,
    options: [.curveEaseInOut, .autoreverse],
    animations: {
        UIView.setAnimationRepeatCount(3)
        UIView.setAnimationRepeatAutoreverses(true)
        self.lightView.backgroundColor = .white
    })

    return propertyAnimator
}()

附：我们需要在选项中提及 .autoreverse。否则 UIView.setAnimationRepeatAutoreverses(true) 将不起作用。

【讨论】：

更好地链接到文档而不是链接到它的图片。