react-native-skia icon indicating copy to clipboard operation
react-native-skia copied to clipboard

TouchHandler is always active on RN Web

Open wcandillon opened this issue 3 years ago • 2 comments

It looks like this might be a regression. On the example app, the touch is always active, in the hue example, for instance, the knob always follows the cursor no matter what. The Aurora example also showcases the issue too.

wcandillon avatar Jul 07 '22 05:07 wcandillon

The reason for this is that on web the mouse is always active - it is hovering. This might be something you'd like to take advantage over - so that's why it is tracked this way on web.

The workaround is to track wether the touch is active or not in a separate value like this:

const down = useValue(false);
const handler = useTouchHandler({
  onStart() {
    down.current = true;
  },
  onActive() { ... } ,
  onEnd() {
    down.current = false;
  }
})

chrfalch avatar Jul 27 '22 09:07 chrfalch

We can also extend the useTouchHandler API to include a flag with down/pressed info where it will differ on web and always be true for native.

chrfalch avatar Jul 27 '22 09:07 chrfalch

Closing since we are encouraging our users to use gesture handler instead.

wcandillon avatar Oct 19 '23 15:10 wcandillon