How could I use Path as an eraser for painting app

[hungtooc]

I'm currently create a painting app using Skia, but i'm stuck at how to create eraser,
like this app:

[wcandillon]

It's a good question. How is the current functionality working? is it working with a rasterized layer (so you would need to draw transparency as the eraser) or is it working with paths? (so you would need to inverse clip the eraser path).

[tanhsnkt1997]

@hungtooc Have you found a way to do it yet? Can you share it yourself. :)

[hungtooc]

@hungtooc Have you found a way to do it yet? Can you share it yourself. :)

I followed this https://github.com/Shopify/react-native-skia/blob/main/example/src/Examples/API/BlendModes.tsx

• To create easer path,

const paint = Skia.Paint(); 
... // some other code
paint.setBlendMode(BlendMode[enumKey('clear')]); // append this. set blend mode 'clear'

• To create brust path,

const paint = Skia.Paint(); 
... // some other code
// leave blend mode default

[congduong97]

@hungtooc ,
Could u share more detail about your solution?
When i use clear blendmode, all paths on canvas are removed.
Thanks,

[pardipbhatti8791]

Hi @congduong97 this might help you out. This is how I am using blendmode form eraser. Let me know if you still need more help thanks
setIsEraser: (isEraser) => {
const { toolType, currentColor, strokeWidth } = get();
const paint = Skia.Paint();
if (toolType === "pen") {
paint.setColor(Skia.Color(currentColor));
paint.setBlendMode(BlendMode[enumKey("src")]);
paint.setStrokeWidth(strokeWidth);
paint.setAntiAlias(true);
paint.setStyle(PaintStyle.Stroke);
} else {
paint.setBlendMode(BlendMode[enumKey("clear")]);
paint.setStrokeWidth(8);
paint.setAntiAlias(false);
paint.setStyle(PaintStyle.Stroke);
}
//@ts-ignore
set({ currentPaint: paint, isEraser });
},

[congduong97]

Hi @pardipbhatti8791 , i try to do like that, but it doesn't work