score:1

You need to return false in onMoveShouldSetPanResponder to stop PanResponder. Consider following example:

this._panResponder = PanResponder.create({
  {...}
  onMoveShouldSetPanResponder: (e, gestureState) => {
    if (stopPanResponder) {
      return false;
    }
    return true;
  },
  {...}
  onPanResponderTerminationRequest: () => true
});

score:2

You can stop a PanReponder system by enabling the PanResponder on the parent view.

From the documentation, we have:

onStartShouldSetResponder and onMoveShouldSetResponder are called with a bubbling pattern, where the deepest node is called first. That means that the deepest component will become responder when multiple Views return true for *ShouldSetResponder handlers. This is desirable in most cases, because it makes sure all controls and buttons are usable.

However, sometimes a parent will want to make sure that it becomes responder. This can be handled by using the capture phase. Before the responder system bubbles up from the deepest component, it will do a capture phase, firing on*ShouldSetResponderCapture. So if a parent View wants to prevent the child from becoming responder on a touch start, it should have a onStartShouldSetResponderCapture handler which returns true.

In your case, you should set the onMoveShouldSetPanResponderCapture for the parent view, when your condition is met.

onMoveShouldSetPanResponderCapture: () => this.isMyConditionTrue(),

AND, also set the following attribute on the child responder:

onPanResponderTerminationRequest: () => true,

in order to allow the parent to capture the responder.


Related Query

More Query from same tag