CAShapeLayer的笔画停止在错误的位置?

时间:2018-07-19 18:21:46

标签: swift uibezierpath cashapelayer

我绘制了一个简单的圆形进度视图,如下所示:

let trackLayer:CAShapeLayer = CAShapeLayer()
let circularPath:UIBezierPath = UIBezierPath(arcCenter: CGPoint(x: progressView.frame.width / 2, y: 39.5), radius: progressView.layer.frame.size.height * 0.4, startAngle: -CGFloat.pi / 2, endAngle: 2 * CGFloat.pi, clockwise: true)
trackLayer.path = circularPath.cgPath
trackLayer.strokeColor = UIColor.lightGray.cgColor
trackLayer.lineWidth = 6
trackLayer.fillColor = UIColor.clear.cgColor
trackLayer.lineCap = kCALineCapRound
progressView.layer.insertSublayer(trackLayer, at: 0)
let progressLayer:CAShapeLayer = CAShapeLayer()
progressLayer.path = circularPath.cgPath
progressLayer.strokeColor = UIColor.blue.cgColor
progressLayer.lineWidth = 6
progressLayer.fillColor = UIColor.clear.cgColor
progressLayer.lineCap = kCALineCapSquare
progressLayer.strokeEnd = 0
progressView.layer.insertSublayer(progressLayer, above: trackLayer)

在某些情况下,我尝试更新progressLayer

if let sublayers = progressView.layer.sublayers {
    (sublayers[1] as! CAShapeLayer).strokeEnd = 0.5
}

现在,如果我正确理解了strokeEnd,则0是循环路径的起点,而1是终点,这意味着0.5应该成为环形路径的起点走到一半,对不对?这是我得到的:

Stroke of progress layer

我测试了多个值,结果发现0.78周围有一个完整的圆圈。直到1为止的任何内容都不会改变。谁能告诉我我在这里想念的东西。也许我的圆形路径的开始或结束角度有问题?或者也许我只是完全误解了strokeEnd的工作方式,在这种情况下,非常感谢您进行解释。

1 个答案:

答案 0 :(得分:1)

  

谁能告诉我我在这里想念的东西。也许我的圆形路径的开始或结束角度有问题?

完全正确。考虑一下您的路径(circularPath),该路径被指定为形状图层的路径。它从startAngle: -CGFloat.pi / 2endAngle: 2 * CGFloat.pi。这不仅仅是一个完整的圈子,还更多。你有看到?这是一个四分之一圈!

这就是为什么在0.78(实际上是0.8或五分之四以上)上,strokeEnd的值更改似乎什么都没有改变的原因;您只是在绘制圆的起点,重新绘制已经绘制的圆的一部分。

您可能是说

startAngle: -.pi / 2.0, endAngle: 3 * .pi / 2.0

(尽管 I 要做的是从0.pi*2并应用旋转变换以从顶部开始绘制)。


您的代码的另一个问题可能会造成问题,原因是您忘记为任一层提供框架了。因此它们没有大小。