如何使用UIBezierPath绘制从指定半径起始的内圆弧形?
你要绘制从指定内径起始的圆弧,不需要依赖遮罩,直接通过拼接UIBezierPath路径形成闭合环形扇区即可实现,后续动态调整内径、外径、角度都非常方便。
具体的路径构建逻辑为:
- 先定位到外圆弧的起始点,绘制指定范围的外圆弧
- 直线连接到内圆弧的对应端点
- 反向绘制内圆弧
- 闭合路径后填充即可得到你要的效果
示例代码如下:
let outerRadius = self.frame.size.height / 2 // 可根据业务需求动态计算的内径,比如按百分比赋值 let innerRadius = outerRadius * 0.5 let line1 = UIBezierPath() // 定位到外弧起始点 let outerStartX = center.x + outerRadius * cos(CGFloat(45.0).toRadians()) let outerStartY = center.y + outerRadius * sin(CGFloat(45.0).toRadians()) line1.move(to: CGPoint(x: outerStartX, y: outerStartY)) // 绘制外圆弧,参数和你原有逻辑一致 line1.addArc( withCenter: center, radius: outerRadius, startAngle: CGFloat(45.0).toRadians(), endAngle: CGFloat(315).toRadians(), clockwise: false ) // 连接到内弧的结束点 let innerEndX = center.x + innerRadius * cos(CGFloat(315).toRadians()) let innerEndY = center.y + innerRadius * sin(CGFloat(315).toRadians()) line1.addLine(to: CGPoint(x: innerEndX, y: innerEndY)) // 反向绘制内圆弧 line1.addArc( withCenter: center, radius: innerRadius, startAngle: CGFloat(315).toRadians(), endAngle: CGFloat(45.0).toRadians(), clockwise: true ) // 闭合路径 line1.close() // 填充 UIColor(red: 0.6, green: 0.8157, blue: 0.4314, alpha: 1.0).setFill() line1.fill()
后续需要根据百分比调整圆弧半径时,直接修改innerRadius或者outerRadius的取值即可,不需要改动其他逻辑。
内容的提问来源于stack exchange,提问作者Jayasabeen Appukuttan
相关产品推荐
相关产品推荐

