How to erase Path stroke in swiftUI? - ios

Question

I am trying to erase Path stroke by setting blendMode modifier, but no luck there is no clear mode available like in UIGraphicsBeginImageContext is setBlendMode(CGBlendMode.clear).
I tried all modes but no luck, it multiply colours producing some new colours of layers.
I think there will be some mechanism available to clear bottom layers colour,
If you know please post the answer.
Thank you.
my code :
struct Point : Hashable {
let x: CGFloat
let y: CGFloat
init(_ p:CGPoint) {
x = p.x
y = p.y
}
func toCGPoint() -> CGPoint {
CGPoint(x: x, y: y)
}
}
struct line:Hashable {
var line:[Point] = []
var color:Color
var eraseMode:Bool
}
struct editImage: View {
#State private var eraseMode = false
#State private var lines:[line] = [line(color: .red, eraseMode: false)]
var body: some View {
ZStack{
VStack{
Toggle(isOn: $eraseMode) {
Text("Erase Mode")
}.padding(.horizontal)
.onChange(of: eraseMode) {_eraseMode in
lines[lines.count-1].eraseMode = _eraseMode
}
Button(action: {
lines.removeAll()
lines.append(line(color: .green, eraseMode: eraseMode))
}, label: {
Text("Clear Canvas").padding()
})
ZStack{
ForEach(lines,id:\.self){line in
Path{p in
var f = true
line.line.forEach { point in
if f {
p.move(to: point.toCGPoint())
f = false
}else{
p.addLine(to: point.toCGPoint())
}
}
}.stroke(line.color,style: StrokeStyle(lineWidth: 14, lineCap: .round, lineJoin: .bevel, miterLimit: 0, dash: [], dashPhase: 0))
.blendMode(line.eraseMode ? BlendMode.hue : BlendMode.normal)
}
}.frame(width: 300, height: 300)
.background(Color.gray)
.gesture(DragGesture(minimumDistance: 0, coordinateSpace: .local).onChanged({ v in
lines[lines.count-1].line.append(.init(v.location))
}).onEnded({ _ in
lines.append(line(color: .red, eraseMode: eraseMode))
}))
}
}
}
}
what i need is in the GIF demo;