Attempting to swipe back but not actually swiping back causes undesirable blank view while text input is focused about react-native-keyboard-manager

[douglasjunior]

I've never encountered this problem in the projects I've worked on.

This seems to be a conflict related to the navigation library. Are you using React Navigation? react-native-screens? Because in React Navigation we have just one native screen, and then the internal screens are simulated with "Views" and animation.

Can you share a reproducible example with these libraries together?

[itsramiel]

sure. I will work one a reproducable demo compiled using eas build and share the result and the repo link. And yes I am using react navigation and react-native-screens

[itsramiel]

Same results with the following minimal repo:

ex2.mp4

ex1.mp4

[douglasjunior]

Bingo, the problem is related to "@react-navigation/native-stack". Replacing to "@react-navigation/stack" the problem dont happens.

I will report to IQKeyboardManager and make myself available to help if necessary.

Let's follow the thread hackiftekhar/IQKeyboardManager#1361 and hackiftekhar/IQKeyboardManager#1422

[douglasjunior]

I created a native iOS Xcode project, with Storyboards and Navigation Controllers, and problem don't happen.

This make me think that the "react-native-screens" uses some strategy to do a "native navigation" that's breaking the IQKeyboardManager.

Possible related issues: https://github.com/software-mansion/react-native-screens/issues?q=is%3Aissue+blank+ios

[itsramiel]

yes confirmed that the bug is not there when using stack instead of native stack. thank you!!

[hirbod]

@ramiel1999 maybe worth an issue report at react-native-screens.

[landabaso]

For the moment, I think it's better to disable gestures when using the native-stack.

      <NativeStack.Navigator
        screenOptions={{
          //Disable goBack with gesture to prevent this issue:
          //https://github.com/douglasjunior/react-native-keyboard-manager/issues/89
          ...(Platform.OS === 'ios' ? { gestureEnabled: false } : {}),
        }}
      >

[itsramiel]

For the moment, I think it's better to disable gestures when using the native-stack.

      <NativeStack.Navigator
        screenOptions={{
          //Disable goBack with gesture to prevent this issue:
          //https://github.com/douglasjunior/react-native-keyboard-manager/issues/89
          ...(Platform.OS === 'ios' ? { gestureEnabled: false } : {}),
        }}
      >

That's a behavior almost all ios user rely on. Definitely not a good solution. A solution I found was to use scrollviews instead of views for the parent component of the screen if possible because then it doesnt happen

[landabaso]

That's a behavior almost all ios user rely on. Definitely not a good solution. A solution I found was to use scrollviews instead of views for the parent component of the screen if possible because then it doesn't happen

It's a bad solution. However, when the bug occurs then the App gets broken in my case, which is even worse. I am already using <ScrollView> as the parent component of all the Screens. The bug shows up after the TextInput is blurred in my case.