在 CABasicAnimation (iOS) 中快进答案

【问题标题】：Skip forward in CABasicAnimation (iOS)在 CABasicAnimation (iOS) 中快进
【发布时间】：2016-07-30 02:03:47
【问题描述】：

我目前有一个用作视频进度指示器的动画，效果很好。但是，现在我们有一个功能，允许用户通过点击它来跳过 2.5 秒的视频，因此我正在尝试实现进度指示器动画以向前跳过 2.5 秒的动画。我如何将动画向前跳过 2.5 秒？我试过“animationGroup.timeOffset = 2.5”，但它不起作用。

func performProgressIndicatorAnimation(duration: Float64) {
    layer.mask = nil
    layer.speed = 1.0

    self.duration = duration
    let strokeStartAnimation = CABasicAnimation(keyPath: "strokeStart")
    strokeStartAnimation.fromValue = 0
    strokeStartAnimation.toValue = 1
    strokeStartAnimation.duration = duration
    strokeStartAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear)

    animationGroup = CAAnimationGroup()
    animationGroup.duration = duration
    animationGroup.animations = [strokeStartAnimation]
    externalCircle.addAnimation(animationGroup, forKey: "animationGroup")

}

//这里是我的 externalCircle 的绘制位置：

private func drawCircles() {

    let externalCirclePath = UIBezierPath(roundedRect: CGRectMake(0, 0, bounds.height, bounds.height), cornerRadius: bounds.height / 2)
    externalCircle.path = externalCirclePath.CGPath
    externalCircle.fillColor = UIColor.clearColor().CGColor
    externalCircle.strokeColor = UIColor.whiteColor().CGColor
    externalCircle.lineWidth = 2

    let internalCircleRadius = bounds.size.height / 5
    let internalCirclePath = UIBezierPath(roundedRect: CGRectMake(0, 0, internalCircleRadius * 2, internalCircleRadius * 2), cornerRadius: internalCircleRadius)
    internalCircle.path = internalCirclePath.CGPath
    internalCircle.fillColor = UIColor.whiteColor().CGColor
    internalCircle.position = CGPointMake(CGRectGetMidX(bounds) - internalCircleRadius,
                                          CGRectGetMidY(bounds) - internalCircleRadius);

    layer.addSublayer(internalCircle)
    layer.addSublayer(externalCircle)
}

【问题讨论】：

标签： ios cabasicanimation

【解决方案1】：

如果您使用 timeOffset 跳过一部分动画，它仍将播放相同的总时长。动画只是循环播放并再次播放，直到它最初开始的地方。例如：动画：A->B->C。如果您使用 timeOffSet 从 B 开始，它将是：B->C->A

在这种情况下，我想你可以关闭这个动画，然后添加一个新的。

【讨论】：

是的，这就是我必须做的（见我的回答）

【解决方案2】：

通过删除之前的动画并根据经过的百分比（带有跳过）启动它来做到这一点

func skipProgressIndicatorAnimation(currentTime: CMTime, timeToSkip: Double, duration: CMTime) {

    animationGroup = nil
    externalCircle.removeAllAnimations()

    let percentageElapsedWithSkip = (CMTimeGetSeconds(currentTime) + timeToSkip) / CMTimeGetSeconds(duration)

    let strokeStartAnimation = CABasicAnimation(keyPath: "strokeStart")
    strokeStartAnimation.fromValue = percentageElapsedWithSkip
    strokeStartAnimation.toValue = 1
    strokeStartAnimation.duration = CMTimeGetSeconds(duration) - CMTimeGetSeconds(currentTime) - timeToSkip
    strokeStartAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear)

    animationGroup = CAAnimationGroup()
    animationGroup.duration = CMTimeGetSeconds(duration) - CMTimeGetSeconds(currentTime) - timeToSkip
    animationGroup.animations = [strokeStartAnimation]
    externalCircle.addAnimation(animationGroup, forKey: "animationGroup")

}

【讨论】：