Drawer swipe gesture steals all events from PanResponder > 10px delta

[benogle]

Issue Description

onPanResponderMove only called for 10px or so (the slop threshold, I assume), then the drawer gesture takes over. No other PanResponder lifecycle events are called after it takes over.

Disabling the drawer gesture with disableOpenGesture fixes this. But we'd like to keep the drawer gesture.

Steps to Reproduce / Code Snippets / Screenshots

Create a single page app with a drawer and the swipe gesture enabled. Create a component with this pan responder in the root component:

this._panResponder = PanResponder.create({
  onStartShouldSetPanResponder: () => true,
  onStartShouldSetPanResponderCapture: () => true,

  onMoveShouldSetPanResponder: () => true,
  onMoveShouldSetPanResponderCapture: () => true,

  onPanResponderMove: (e, gestureState) => {
    console.log('onPanResponderMove', gestureState.dx, gestureState.dy)
  },
  onPanResponderGrant: (evt, gestureState) => {
    console.info('onPanResponderGrant')
  },
  onPanResponderReject: evt => {
    console.info('onPanResponderReject')
  },
  onPanResponderTerminationRequest: () => {
    console.log('onPanResponderTerminationRequest')
    return false
  },
  onShouldBlockNativeResponder: () => true,
})

Try to swipe down on your component.

---

Environment

• React Native Navigation version: 1.1.309
• React Native version: 0.50.0
• Platform(s) (iOS, Android, or both?): iOS
• Device info (Simulator/Device? OS version? Debug/Release?): iphone 6 simulator debug

[ahoseinian]

I am having the same problem on ios without using the drawer at all, is there any fix for it?

[PimDeWitte]

Having the same issue. disabling the drawer on the grant also doesn't work. There has to be a way where disabling the drawer via the disable/enable method will remove this call?

[akmjenkins]

@PimDeWitte - did you try my PR? It has to do with the native gesture always being enabled after a drawer has been enabled the first time.

[AndrePech]

Having the same issue, I am trying to use a Swipable List item, does not work even if the swipe gesture is opposite to the drawer direction.

[isaachinman]

Is there any solution for this? Copy/pasting the official PanResponderExample into a react-native-navigation project will demonstrate the issue here.

As @PimDeWitte mentioned, disabling the drawer does not make a difference.

Update: for now, this issue can be avoided by using disableOpenGesture: false. Of course at the moment this means foregoing gesture opening across your entire app, as this is a config option and can't be changed on the fly.

I would suggest, as the fix to this issue, to simply replicate whatever is happening behind the scenes of disableOpenGesture: false, when setDrawerEnabled({ enabled: false }) is called.

[akmjenkins]

@isaachinman Please see the open PR #2578. It's a trivial fix. The native iOS gestureresponder simply needs to be removed from the drawer when it's disabled (and [re]added when the drawer is enabled).

[isaachinman]

@akmjenkins Yes, I saw that. However, I'm wary of depending on a fork for such a core requirement.

I see that #2578 has been open for almost three months now. Who has write access to this repo?

[collinglass]

Is there any way to get the pan responder to fire the onPanResponderTerminate event, signalling that the drawer has taken over the responder events? This is the behaviour I would expect.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you believe the issue is still relevant, please test on the latest version and report back. Thank you for your contributions.

[benogle]

Still an issue

[ujwal-setlur]

This is an issue on v2 as well. I am using a swipable list view, and on iOS, the swipe stops after 10 pixels or so, even on the opposite side of the drawer. Works on android. Where would I specify disableOpenGesture: false?

[ujwal-setlur]

I tried PR #2578 on the v2 code base, and it didn't help...