Android: Hold gesture always failing (TapGestureHandler)

[mrousavy]

I'm trying to implement a "tap and hold" gesture which will be used to record a video, similar to snapchat, instagram etc.

I've decided to go with the following approach:

1. Create a TapGestureHandler
2. Use the onHandlerStateChanged event to check when the user started to put his finger down (State.BEGAN) and start recording the video
3. Use the onHandlerStateChanged event to check whether the user lifted his finger (State.END | State.FAILED | State.CANCELLED) and stop recording the video.

While this works fine on iOS, I've noticed that this always fails on Android.

The flow is the following:

• iOS: State.BEGAN -> (some seconds pass while the user is still holding his finger down) -> State.END
• Android: State.BEGAN -> State.FAILED (immediately)

Which is weird to me. Why is the TapGestureHandler immediately failing?

This is my code:

const onHandlerStateChanged = useCallback(({ nativeEvent: event }) => {
    console.debug(`state: ${Object.keys(State)[event.state]}`);
}, []);

// ...

return (
  <TapGestureHandler
    onHandlerStateChange={onHandlerStateChanged}>
    <Reanimated.View style={[styles.button, buttonStyle, style]} {...props}>
      // ...

Then, when I try to hold the button, my console looks like this:

[Mon Jan 18 2021 14:35:13.960]  DEBUG    state: BEGAN
[Mon Jan 18 2021 14:35:14.461]  DEBUG    state: FAILED

Why?

[mrousavy]

After reading the docs once again, I noticed that I can easily achieve this behaviour by setting the following props to the TapGestureHandler:

• maxDurationMs={99999999}
• shouldCancelWhenOutside={false}