CABasicAnimation around Circle goes too Far - swift

Question

I am looking to have an animated outer layer to a circle that will show progress. What I have below is able to do that; however, the ending animation of the outer fill goes too far. In my example I would like it go from the 12:00 position to the 6:00 position or 50% of the way around the circle. In practice it goes to about the 8:00 position.
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")
}
If I change to the above line to progressAnimation.toValue = 0.4 it will show the 12-6 I am looking for. I am not understanding why it would be 0.4 versus 0.5?

Answer 1

It will be OK to fix the angle .
Turn
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)
A circle is of 2 * CGFloat.pi, not 2.5 * CGFloat.pi.
startAngle: -CGFloat.pi / 2, endAngle: CGFloat.pi * 2 is 2.5 * CGFloat.pi.
2 * CGFloat.pi * 0.5 equals 2.5 * CGFloat.pi * 0.4