UIBezierPath 附加重叠未填充 [英] UIBezierPath appending overlapping isn't filled

问题描述

我正在尝试使用 UIBezierPath.append 合并两个重叠的 UIBezierPath，并且我希望填充重叠的空间.我尝试将 usesEvenOddFillRule 属性设置为 false，但它仍然没有填充.这是问题的最小示例:

I'm trying to merge two overlapping UIBezierPaths using UIBezierPath.append, and I want the overlapping space to be filled. I tried setting the usesEvenOddFillRule property to false, but it still doesn't fill. Here is minimal example of the problem:

override func draw(_ rect: CGRect) {
    let firstShape = UIBezierPath()

    firstShape.move(to: CGPoint(x: 100, y: 100))
    firstShape.addLine(to: CGPoint(x: 100, y: 150))
    firstShape.addLine(to: CGPoint(x: 150, y: 170))
    firstShape.close()

    let secondShape = UIBezierPath(rect: CGRect(x: 125, y: 125, width: 75, height: 75))

    let combined = UIBezierPath()
    combined.append(firstShape)
    combined.append(secondShape)

    UIColor.black.setFill()
    combined.fill()
}

这会产生以下形状:

我想要的样子:

在一个 UIBezierPath 上使用 move(to: CGPoint) 时似乎也会出现这个问题.如果你在同一个 UIBezierPath 上绘制这两个形状，也会出现同样的问题.

This problem also seems to occur when using move(to: CGPoint) on one UIBezierPath. If you would draw both these shapes on the same UIBezierPath, the same problem would occur.

有谁知道如何填充重叠区域?该解决方案最好在执行 addClip()

Does anyone know how to make the overlapping region filled? Preferably the solution would also work when doing addClip()

推荐答案

您将 usesEvenOddFillRule 设置为 false 是正确的.除此之外，您需要确保以相同的方向(顺时针或逆时针)绘制形状.

You were on the right track with setting the usesEvenOddFillRule to false. In addition to that, you need to make sure your shapes are both drawn in the same direction (clockwise or counter-clockwise).

在绘制三角形以反转它时，我反转了您的 addLine 的顺序.

I reversed the order of your addLines when drawing the triangle to reverse it.

override func draw(_ rect: CGRect) {
    let firstShape = UIBezierPath()

    firstShape.move(to: CGPoint(x: 100, y: 100))
    firstShape.addLine(to: CGPoint(x: 150, y: 170))
    firstShape.addLine(to: CGPoint(x: 100, y: 150))
    firstShape.close()

    let secondShape = UIBezierPath(rect: CGRect(x: 125, y: 125, width: 75, height: 75))

    let combined = UIBezierPath()
    combined.append(firstShape)
    combined.append(secondShape)
    combined.usesEvenOddFillRule = false

    UIColor.black.setFill()
    combined.fill()
}

这篇关于UIBezierPath 附加重叠未填充的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！