如何使用带有粗描边的 SwiftUI 平滑绘制路径的曲线？

Question

我正在制作一个基本的绘图应用程序并使用以下教程允许用户绘图：

https://martinmitrevski.com/2019/07/20/developing-drawing-app-with-swiftui/

绘图是使用 DragGesture 绘制的，然后将在 onChange

中观察到的所有点缝合在一起

GeometryReader { geometry in
    Path { path in
        for drawing in self.drawings {
            self.add(drawing: drawing, toPath: &path)
        }
        self.add(drawing: self.currentDrawing, toPath: &path)
    }
    .stroke(Color.black, lineWidth: 15.0)
    .background(Color(white: 0.95))
    .gesture(
        DragGesture(minimumDistance: 0.1)
            .onChanged({ (value) in
                let currentPoint = value.location
                if currentPoint.y >= 0
                    && currentPoint.y < geometry.size.height {
                    self.currentDrawing.points.append(currentPoint)
                }
                
            })
            .onEnded({ (value) in
                self.drawings.append(self.currentDrawing)
                self.currentDrawing = Drawing()
            })
    )
}
.frame(maxHeight: .infinity)



private func add(drawing: Drawing, toPath path: inout Path) {
        let points = drawing.points
        if points.count > 1 {
            for i in 0..<points.count-1 {
                let current = points[i]
                let next = points[i+1]
                path.move(to: current)
                path.addLine(to: next)
            }
        }
    }

我遇到的问题是，对于较粗的笔触，曲线被严重破坏，如下所示。

有没有办法使用这种方法来平滑这些曲线？

Answer 1

您当前正在为每个点创建一个新线段。

您可能想要做的是 move To: 第一个 点，然后 addLine: To 后续点：

private func add(drawing: Drawing, toPath path: inout Path) {
    let points = drawing.points
    if points.count > 1 {
        path.move(to: points[0])
        for i in 1..<points.count-1 {
            path.addLine(to: points[i])
        }
    }
}

如何使用带有粗描边的 SwiftUI 平滑绘制路径的曲线？

How can I smooth out the curves of a drawn Path using SwiftUI with a fat Stroke?

xcode

ios

swiftui