Lottie动画：停止循环，但等待动画完成

Question

我目前正在使用Lottie和Swift为一个按钮添加不同的动画效果。

我需要找到一种方法，可以在动画播放到结尾并开始循环时停止循环。在这个时刻，我想要能够插入另一个非循环动画，以使它看起来像是从循环动画到其他动画的流畅过渡。原因是，我等待网络数据完成后才继续播放循环动画。

我之前是通过另一种方式进入循环动画的。

func animate(animation: Animation?, endIn loop: Animation?) {
    self.setImage(nil, for: .normal)
    self.animationView.isHidden = false
    self.animationView.animation = animation
    self.animationView.loopMode = .playOnce
    self.animationView.play { _ in
        self.animationView.animation = loop
        self.animationView.loopMode = .loop
        self.animationView.play()
    }
}

也许有人已经实现了这样的转换，我会感激任何帮助。

编辑：我尝试以这种方式做，然后在获取完成时只调用self.animationView.loopMode = .playOnce。

func animate(startAnimation: Animation?,
             transitionTo loop: Animation?,
             endAnimation: Animation?,
             image: UIImage?) {
    self.setImage(nil, for: .normal)
    self.animationView.isHidden = false
    self.animationView.animation = startAnimation
    self.animationView.loopMode = .playOnce
    self.animationView.play { _ in
        self.animationView.animation = loop
        self.animationView.loopMode = .loop
        self.animationView.play { _ in
            self.animationView.animation = endAnimation
            self.animationView.loopMode = .playOnce
            self.setImage(image, for: .normal)
        }
    }
}

编辑2：

我发现了一个可行但不太好的解决方案，通过使用upper函数启动循环，然后调用该函数来结束循环：

func stopLoopAndTranstion(to animation: Animation?, endIn image: UIImage?) {
    guard let animation = animation else {
        return
    }

    if self.animationView.realtimeAnimationProgress > 0.95 {
        self.animationView.stop()
        self.animationView.animation = animation
        self.animationView.loopMode = .playOnce
        self.animationView.play()
    } else {
        DispatchQueue.main.asyncAfter(deadline: .now() + 0.01) {
            self.stopLoopAndTranstion(to: animation, endIn: image)
        }
    }
}

我在这里做的是检查动画进度，一旦达到一定的进度，我就停止并替换动画。 我更倾向于将其视为hack而不是解决方案。每次触发此函数时，CPU使用率会增加2-3％，直到动画被替换。 虽然这2-3％可以忽略不计，但我还不满意，并且仍在寻找更清洁的方法来实现这样的操作。

- Cronay

---

等待动画剩余持续时间而不是任意时间？ - Wyetro

Answer 1

你可以使用 Lottie 提供的一个 play(fromProgress...) API 之一。

animationView.play(
    fromProgress: animationView.currentProgress,
    toProgress: 1,
    loopMode: .playOnce,
    completion: { [weak self] completed in
        DispatchQueue.main.asyncAfter(deadline: .now() + 0.01) {
            self.stopLoopAndTranstion(to: animation, endIn: image)
        }
    }
)

这将确保您当前的动画将完成，并且在 completion 块中，您可以执行您的最终工作。

- sabius

Answer 2

也许你只需要将 repeatcount 设置为 0。

- Newarning