如何解决增加UIBezierPath线宽会更改几何形状...?
我创建了一个圆形量规作为计时器的可视指示器。仪表的多个部分指示计时器的不同阶段。 Image here
问题在于,当我向路径添加线宽时,数学不再相加。例如,上图中的蓝色和红色部分的尺寸应相同(占圆的百分比),但是由于线宽,红色与蓝色重叠,同样,灰色部分与蓝色重叠(I沿逆时针方向绘制线段),因此蓝色显得较小。我知道细分是正确创建的,因为如果将线宽设置为1.0,则会得到以下正确结果。 Image here
如果有人对此有任何见解,那就太好了。
提供上下文的代码:
//create path
let circularPath = UIBezierPath(arcCenter: view.center,radius: 100,startAngle: -CGFloat.pi/2,endAngle: 3*CGFloat.pi/2,clockwise: true)
//create segments - this is in a loop that adjusts start/end for all the segments
var tempShapeLayer = CAShapeLayer()
tempShapeLayer.path = circularPath.cgPath
tempShapeLayer.lineWidth = 10
tempShapeLayer.fillColor = UIColor.clear.cgColor
tempShapeLayer.lineCap = CAShapeLayerLineCap.square
tempShapeLayer.strokeStart = start
tempShapeLayer.strokeEnd = end
//next simply add some colors and add to view
解决方法
您使用的线帽样式错误。您应该使用.butt
。
可以在CGLineCap
中找到不同样式的线帽。
-
butt
:末端为平方的线。 Core Graphics绘制这条线,使其仅延伸到路径的确切端点。
-
square
:末端为平方的线。 Core Graphics将线延伸到路径的端点之外,其距离等于线宽的一半。
使用square
上限会导致该行的两端都比应有的长一点。对于除了最后一个绘制的所有段,这不是问题,因为它们的端点将被其他段覆盖。但是,对于最后绘制的部分,它的出现时间要长于双方。
对于线帽样式,您应该使用.butt
。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。