CAShapeLayer/UIBezierPath 在未沿同一方向绘制时剪切多个形状交叉点

Question

我试图在同一层中使用 UIBezierPath 和 CAShapeLayer 绘制多个形状，以便我的 patternImage 颜色正确地穿过所有形状，但似乎有一些奇怪的剪切/剪切，我无法解决。当在同一路径和图层中绘制 2 个形状时，它会剪辑重叠，但仅当形状未沿同一方向绘制时。

我的代码：

let view = UIView()
let path = UIBezierPath()
path.addArc(withCenter: .init(x: 100, y: 100), radius: 100, startAngle: 0 * .pi, endAngle: 2 * .pi, clockwise: true)
path.close()
path.addArc(withCenter: .init(x: 200, y: 100), radius: 100, startAngle: 0 * .pi, endAngle: 2 * .pi, clockwise: true)
path.close()
path.addArc(withCenter: .init(x: 100, y: 300), radius: 100, startAngle: 2 * .pi, endAngle: 0 * .pi, clockwise: false)
path.close()
path.addArc(withCenter: .init(x: 200, y: 300), radius: 100, startAngle: 2 * .pi, endAngle: 0 * .pi, clockwise: false)
path.close()
path.addArc(withCenter: .init(x: 100, y: 500), radius: 100, startAngle: 2 * .pi, endAngle: 0 * .pi, clockwise: false)
path.close()
path.addArc(withCenter: .init(x: 200, y: 500), radius: 100, startAngle: 0 * .pi, endAngle: 2 * .pi, clockwise: true)

let layer = CAShapeLayer()
layer.path = path.cgPath
layer.fillColor = UIColor(patternImage: .maskStripes).cgColor
layer.fillRule = .nonZero
view.layer.addSublayer(layer)

输出：

您可以看到，具有匹配顺时针方向的前两组圆渲染得很好，但方向与中间相反的最后一组被剪掉了。设置 bezierPath 的

usesEvenOddFillRule

或图层的

fillRule

没有帮助，我无法保证在我的真实应用程序中，形状将以相同的方向绘制，因此出现问题。

提前谢谢您。

Answer 1

我认为没有一个解决方案可以使所有重叠的闭合路径填充其区域的并集。我建议为每个要填充的闭合形状创建一个单独的图层，并将它们全部添加为子图层。这将起作用，并允许您为每个使用单独的颜色（如果需要）。