Circle周围的CABasicAnimation太远了

Question

我正在寻找一个动画的外层到一个圆圈，以显示进度。我下面的功能可以做到；但是，外部填充的结束动画太远了​​。在我的示例中，我希望它从12:00位置转到6:00位置，或者绕圆的50％。实际上，它会转到8:00位置。

class CircleView: UIView {

private let progressLayer = CAShapeLayer()
private var progressColor:UIColor!

required convenience init(progressColor:UIColor) {
    self.init(frame:.zero)
    self.progressColor = progressColor
}

override init(frame: CGRect) {
    super.init(frame: frame)

    self.translatesAutoresizingMaskIntoConstraints = false
}

required init?(coder: NSCoder) {
    super.init(coder: coder)
}

override func draw(_ rect: CGRect) {
    setup()
}

private func setup() {
    let circleLayer = CAShapeLayer()

    let center = CGPoint(x: self.bounds.size.width / 2, y: self.bounds.size.height / 2)
    let path = UIBezierPath(arcCenter: center, radius: self.frame.width / 2, startAngle: -CGFloat.pi / 2, endAngle: CGFloat.pi * 2, clockwise: true)
    circleLayer.path = path.cgPath
    circleLayer.strokeColor = UIColor.gray.cgColor
    circleLayer.fillColor = UIColor.white.cgColor
    circleLayer.lineCap = CAShapeLayerLineCap.round
    circleLayer.lineWidth = 20
    circleLayer.masksToBounds = false
    self.layer.addSublayer(circleLayer)

    progressLayer.path = path.cgPath
    progressLayer.strokeColor = progressColor.cgColor
    progressLayer.fillColor = UIColor.clear.cgColor
    progressLayer.lineCap = CAShapeLayerLineCap.round
    progressLayer.lineWidth = 20

    circleLayer.addSublayer(progressLayer)
}

func animateProgress(percentComplete:Double) {
    let progressAnimation = CABasicAnimation(keyPath: "strokeEnd")

    progressAnimation.fromValue = 0
    progressAnimation.toValue = 0.5
    progressAnimation.duration = 2
    progressAnimation.fillMode = .forwards
    progressAnimation.isRemovedOnCompletion = false

    progressLayer.add(progressAnimation, forKey: "strokeEnd")
}

如果将上面的行更改为progressAnimation.toValue = 0.4，则会显示我要查找的12-6。我不明白为什么它将是0.4对0.5？

Answer 1

可以固定角度

转身

let path = UIBezierPath(arcCenter: center, radius: self.frame.width / 2, startAngle: -CGFloat.pi / 2, endAngle: CGFloat.pi * 2, clockwise: true)

to

let path = UIBezierPath(arcCenter: center, radius: self.frame.width / 2, startAngle: -CGFloat.pi / 2, endAngle: 1.5 * CGFloat.pi, clockwise: true)