ios - Creating a union of 2 bezier paths

Question

I have two bezier paths that i'd like to combine to form a union, so that I can stroke the entire outer shape. In my case, it's a speech bubble with a tail, so although it's not a complex shape it would actually be quite hard to create it using one single path.

There doesn't appear to be a Core Graphics API for creating unions. Am I wrong?

If I'm not, does anyone know of a library that can handle this? I've search GitHub to no avail.

Answer 1

如果您使用封闭的形状，UIBezierPath 会这样做。

UIBezierPath *firstPath = [UIBezierPath bezierPath];
// build your path

UIBezierPath *secondPath = [UIBezierPath bezierPath];
// build your path

[firstPath appendPath:secondPath];

Answer 2

SwiftUI

func createView() -> some View {
    let a = Path { path in
        path.move(to: CGPoint(x: 0, y: 0))
        path.addLine(to: CGPoint(x: 50, y: 100))
        path.addLine(to: CGPoint(x: 100, y: 0))
    }
    .stroke(Color.white, style: StrokeStyle(lineWidth: 5, lineCap: .round, lineJoin: .round))

    let b = RoundedRectangle(cornerRadius: 5, style: .continuous)
        .fill(Color.white)
        .frame(width: 30, height: 30)
        .position(CGPoint.zero)

    return ZStack {
        a
        b
    }
    .compositingGroup()
    .colorMultiply(Color.red)
}

Answer 3

在 Swift 3 中，贝塞尔路径可以通过以下方式统一：

 override func draw(_ rect: CGRect) {
    super.draw(rect)

    UIColor.black.setStroke()
    UIColor.red.setFill()

    let currentContext = UIGraphicsGetCurrentContext()
    currentContext?.saveGState() 

    let path = drawTopView()
    path.lineWidth = 5.0
    path.fill()
    path.stroke()

    let middlepath = drawMiddleView()
    middlepath.lineWidth = 2.0
    middlepath.fill()
    middlepath.stroke()

    path.append(middlepath)
    currentContext?.restoreGState()
}