skip to Main Content

I have upgraded from react-navigation 5 to 6:

-    "@react-navigation/bottom-tabs": "^5.10.6",
-    "@react-navigation/material-top-tabs": "^5.3.15",
-    "@react-navigation/native": "^5.8.6",
-    "@react-navigation/routers": "^5.6.0",
-    "@react-navigation/stack": "^5.12.3",
-    "react-native-gesture-handler": "1.10.3",

NEW DEPS:
+    "react-native-gesture-handler": "^2.7.0",
+    "@react-navigation/bottom-tabs": "^6.2.4",
+    "@react-navigation/material-top-tabs": "^6.3.0",
+    "@react-navigation/native": "^6.0.13",
+    "@react-navigation/routers": "^6.1.3",
+    "@react-navigation/stack": "5.14.9",

After the upgrade I noticed that on Android 8 and 9 some stack screens have some strage feature of closing current screen with swipe from top to bottom.

Adding gestureEnabled: false as navigator or screen option doesn’t seem to have any effect.

Screenshots with close on swipe top to bottom:

first image when drag started

second drag image

See attached video:
https://drive.google.com/file/d/1Xt08w7S-bFXcOMx01WAzHGwLvLLwAl7e/view

2

Answers


  1. Chosen as BEST ANSWER

    In my case the root navigator had gestureEnabled: true and for some reason the nested stack navigators could not overwrite that value on Android 8 and 9.

    I had to set that to false in the root stack navigator to make it work for nested navigators too.

      screenOptions={{
        gestureEnabled: false
      }}
    

    Note: there are multiple issues reported in github related to how that property works for Android. Some people applied as an workaround a huge swipe threshold.


  2. Take a look at the content of the stack screens that has issues.

    Check if the view is using a ScrollView component.

    If it is, try to use the ScrollView from react-native-gesture-handler library instead of react-native.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search