ios - 如何使用 CABasicAnimation 在 Swift 中更改圆形动画的起点？

Question

我有一个函数可以绘制一个动画圆圈作为处理栏。我可以从圆圈的底部得到它的动画。但是，我想将起点更改为圆的顶部。

我在下面附上了我的代码:

func animateProgressView(_finishPoint:CGFloat, _stringShowAtEnd: String) {
    progressLabel.text = "Rating..."
    progressLayer.strokeEnd = 0.0
    
    let animation = CABasicAnimation(keyPath: "strokeEnd")
    animation.fromValue = CGFloat(0.0)
    animation.toValue = CGFloat(_finishPoint)
    animation.duration = 2.0
    animation.delegate = self
    animation.removedOnCompletion = false
    animation.additive = true
    animation.fillMode = kCAFillModeForwards
    progressLayer.addAnimation(animation, forKey: "strokeEnd")
    stringShowAtEnd=_stringShowAtEnd
}

我很快尝试过的:

• 将 fromValue 和 toValue 更改为 0.5 和 1.0。//没用
• 将填充模式更改为 kCAFillModeBackwards。//没用
• 将 keyPath 和 forKey 更改为“strokeStart”//没有用

我没有花太多时间阅读官方文档。

任何人都可以快速回答我如何将起点更改为顶部，如下图所示？

---

解决方案:

感谢“rob mayoff”。他指出我应该发布路径创建功能，但我没有注意到和识别。我通过修改 startAngle 和 endAngle 的角度解决了这个问题。

我附上了下面的代码。希望对遇到同样问题的大家有所帮助。

private func createProgressLayer() {
    //let startAngle = CGFloat(M_PI_2)  //old angle, Pi/2=90 degrees ,started from the bottom
    //let endAngle = CGFloat(M_PI * 2 + M_PI_2) //old angle,2*Pi+Pi/2=360 + 90 degrees ,end at the bottom

    let startAngle = CGFloat(M_PI_2*3)  //new angle, (Pi/2)*3=90*3 degrees ,starts from the top

    
    let endAngle = CGFloat(M_PI * 2 + M_PI_2*3) //new angle, 2*Pi+(Pi/2)*3=360 + 90*3 degrees ,ends at the top
    
    
    let centerPoint = CGPointMake(CGRectGetWidth(frame)/2 , CGRectGetHeight(frame)/2)
    
    var gradientMaskLayer = gradientMask()
    progressLayer.path = UIBezierPath(arcCenter:centerPoint, radius: CGRectGetWidth(frame)/2 - 30.0, startAngle:startAngle, endAngle:endAngle, clockwise: true).CGPath
    progressLayer.backgroundColor = UIColor.clearColor().CGColor
    progressLayer.fillColor = nil
    progressLayer.strokeColor = UIColor.blackColor().CGColor
    progressLayer.lineWidth = 10.0
    progressLayer.strokeStart = 0.0
    progressLayer.strokeEnd = 0.0
    
    gradientMaskLayer.mask = progressLayer
    layer.addSublayer(gradientMaskLayer)
}

Answer 1

您正在创建路径，以便起点位于底部。您需要创建路径，使起点位于顶部。