swift - 如何绘制两条没有连接线的圆弧路径？

Question

我正在使用 CGMutablePath 绘制一个 wifi 标志。当我通过addArc(center:radius:startAngle:endAngle:clockwise:transform:)绘制第二个圆弧时，它会自动像文档指定的那样绘制一条线如果路径已经包含子路径, 此方法添加一条连接当前点和圆弧起点的线。。没有这条线我怎么画？谢谢

Answer 1

如果你想绘制一条没有从前一点开始的直线的圆弧，你需要在添加圆弧之前将路径移动到圆弧的起点——使用move(to:)。弧的起点可以计算为:

center.x + radius * cos(startAngle)
center.y + radius * sin(startAngle)

您可以利用 CGPath 的功能来创建笔画副本，而不是自己计算点来创建每条弧线的轮廓。这样做，您只需要为图标的每个“栏”创建一个弧形的基本路径:

let basePath = CGMutablePath()

let center     = CGPoint.zero
let startAngle = CGFloat.pi * 0.75 // 135 degrees
let endAngle   = CGFloat.pi * 0.25 //  45 degrees

let radii: [CGFloat] = [10, 20, 30, 40]

for radius in radii {
    // Move to the start point of the arc
    basePath.move(to: CGPoint(x: center.x + radius * cos(startAngle),
                              y: center.y + radius * sin(startAngle)))
    // Add the arc, starting at that same point
    basePath.addArc(center: center, radius: radius,
                    startAngle: startAngle, endAngle: endAngle,
                    clockwise: true)
}

这将创建一个像这样的基本形状，没有任何厚度:

接下来，您通过抚摸创建基本路径的副本。您可以在此处配置图标条的粗细及其末端的样式(方形或圆形):

let stroked = basePath.copy(strokingWithWidth: 5, // The width/thickness of each stroked arc
                            lineCap: .square,     // Make square corners for the ends of each arc
                            lineJoin: .miter, miterLimit: 0)

结果是这样的形状: