2

Sometimes when i navigate to a screen, the screen appear moved to the right. This only happen on iOS. I've tried removing the KeyboardAviodingView, SaveAreaView ( using the SafeAreaView provided by react navigation too), Views that wrap the entire App to check if any of those was causing the problem, but with no luck.

example

package.json dependencies:

{
    "@unimodules/core": "~5.0.0",
    "axios": "^0.19.0",
    "expo": "^36.0.0",
    "expo-application": "^2.0.0",
    "expo-constants": "^8.0.0",
    "expo-font": "~8.0.0",
    "expo-linear-gradient": "~8.0.0",
    "expo-localization": "~8.0.0",
    "expo-secure-store": "~8.0.0",
    "expo-server-sdk": "^3.3.0",
    "formik": "^2.1.4",
    "i18n-js": "^3.3.0",
    "i18next": "^19.3.2",
    "immutable": "^4.0.0-rc.12",
    "lottie-react-native": "~2.6.1",
    "moment": "^2.24.0",
    "nyc": "^14.1.1",
    "react": "^16.12.0",
    "react-dom": "16.9.0",
    "react-hook-form": "^3.26.4",
    "react-i18next": "^11.3.3",
    "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.1.tar.gz",
    "react-native-animatable": "^1.3.3",
    "react-native-appearance": "~0.3.1",
    "react-native-calendars": "^1.264.0",
    "react-native-elements": "^1.2.7",
    "react-native-formik": "^1.7.7",
    "react-native-gesture-handler": "~1.5.0",
    "react-native-keyboard-aware-scroll-view": "^0.9.1",
    "react-native-modal": "^11.5.1",
    "react-native-modal-datetime-picker": "^8.1.1",
    "react-native-paper": "^3.5.1",
    "react-native-parallax-scroll-view": "^0.21.3",
    "react-native-platform-touchable": "^1.1.1",
    "react-native-reanimated": "~1.4.0",
    "react-native-safe-area-context": "0.6.0",
    "react-native-screens": "2.0.0-alpha.12",
    "react-native-shared-element": "~0.5.1",
    "react-native-snap-carousel": "^3.8.4",
    "react-native-svg": "9.13.3",
    "react-native-svg-uri": "^1.2.3",
    "react-native-vector-icons": "^6.6.0",
    "react-native-web": "^0.11.7",
    "react-native-workers": "^0.3.1",
    "react-navigation": "4.1.1",
    "react-navigation-animated-switch": "^0.3.2",
    "react-navigation-collapsible": "^3.0.3",
    "react-navigation-drawer": "^2.2.2",
    "react-navigation-fluid-transitions": "^0.3.2",
    "react-navigation-header-buttons": "^3.0.3",
    "react-navigation-material-bottom-tabs": "2.1.2",
    "react-navigation-shared-element": "^0.5.0",
    "react-navigation-stack": "1.9.3",
    "react-navigation-tabs": "^2.5.6",
    "react-redux": "^7.1.1",
    "recompose": "^0.30.0",
    "redux": "^4.0.4",
    "redux-thunk": "^2.3.0",
    "remove": "^0.1.5",
    "sentry-expo": "^2.0.1",
    "yup": "^0.27.0"
}

EDIT: The error only happens when i show the keyboard in the screen B and then go back to the screen A

alain00
  • 161
  • 2
  • 11
  • Hi! You should create a mcve (https://stackoverflow.com/help/mcve) - if you don't figure it out your own in the process of doing so it will give an example that others can help you with! – brentvatne Mar 31 '20 at 18:11
  • please add code for better understanding – Ferin Patel Apr 01 '20 at 10:22

2 Answers2

0

The problem occurs when:

1) I navigate to a screen -> this.props.navigation.navigate ('');

2) I put the application in the foreground;

3) go back -> navigation.goBack ();

4) I find the screen moved to the right.

Daniele Vasalli
  • 1
0

Upgrading react-navigation-stack to 2.3.11 fixed the problem

alain00
  • 161
  • 2
  • 11