globalCompositeOperation problem (because of bridge?)

[antonkarytski]

I faced with problem when try to implement "erase" tool, for this we are doing:

ctx.globalCompositeOperation = 'destination-out' 
(or more complex stuff, no metter)
 ctx.beginPath()
 ctx.moveTo(p2.x, p2.y)
 ctx.lineTo(p1.x, p1.y)
 ctx.stroke()

but there is a little delay between js command and actual changing of canvas state (i think because of rn bridge?) and sometimes occurs that i have some first points drew with black stroke/fill or something like that and then it shows correctly with correct 'destination-out' state. so far i workaround with setTimeout delay, but i believe its a pretty unstable solution,
have you faced this kind of issue?

[antonkarytski]

fixed this by calling ctx.flushJsCommands2CallNative after changing globalCompositeOperation, it still blinking, but better than with timeouts

[flyskywhy]

Please test with

ctx.flushJsCommands2CallNative('sync', 'execWithoutDisplay');

or

ctx.flushJsCommands2CallNative('sync', 'execWithDisplay');

and tell me the result, thanks.

[antonkarytski]

Please test with

ctx.flushJsCommands2CallNative('sync', 'execWithoutDisplay');

or

ctx.flushJsCommands2CallNative('sync', 'execWithDisplay');

and tell me the result, thanks.

Nice, thank you! ctx.flushJsCommands2CallNative('sync', 'execWithoutDisplay'); totally remove blinks, execWithDisplay works as if I had 'async' prop.

[flyskywhy]

v2.3.16 fixed it, now you can remove the none standard Web canvas API

ctx.flushJsCommands2CallNative('sync', 'execWithoutDisplay');

from your APP code 😝