4

After switching to react-native-navigation from react-navigation my app cant launch properly.

It either appears as a blank screen or immedialy switches to the background without ability to switch back. Shaking the device or remote command adb shell input keyevent 82 does not show the developer menu.

Fresh app created with react-native init results in the same.

In both cases I went strictly through these steps: https://wix.github.io/react-native-navigation/#/installation-android

Launching example app does not work properly either but it starts and I can use dev menu although the redux example works fine for me.

I have found a lot of people had the same problem before but without a solution. https://github.com/wix/react-native-navigation/issues/2737#issuecomment-367812629, it said that the navigation works and the problem is in JS side. How to modify the JS app to work with this navigation system though?

Radoslav Karlík
  • 41
  • 4
  • Are you properly initializing the Navigator on app startup with ```Navigation.startSingleScreenApp()``` – Jpoliachik Feb 23 '18 at 14:01
  • thanks for mentioning single screen app. That actually works with `Navigation.startSingleScreenApp({ screen: { screen: 'Screen1', title: 'Screen1', } });` where Screen1 is simple React component and it is registered with title Screen1 before. But startTabBasedApp is making the app just switch to background. – Radoslav Karlík Feb 23 '18 at 20:18
  • @RadoslavKarlík did you find any solution? – Awn Ali Apr 25 '18 at 21:01

1 Answers1

0

I have seen a lot of people facing a blank screen issue after react-native-navigation installation. I came across two problems that can lead to a blank screen when you start implementing RNN.

  1. This is the mistake even I did. Once you change your MainActivity and MainApplication as per the doc then you have to change the way you start your main component as per the RNN in Javascript side

  2. Another issue is starting a tab based app but the icons provided by you don't exist.

I also came across another problem when using RNN in which React Native searches for index.android.js instead of index.js. Just override createReactNativeHost method and implement getJSMainModuleName

Add this to MainApplication

@Override
protected ReactNativeHost createReactNativeHost() {
    return new NavigationReactNativeHost(this) {
        @Override
        protected String getJSMainModuleName() {
            return "index";
        }
    };
}

Another issue lies in this line

missingDimensionStrategy "RNN.reactNativeVersion", "reactNative55"

Document says use reactNative55: Support for React Native 0.55 and above but if you are using RN56 then you have to change this to

missingDimensionStrategy "RNN.reactNativeVersion", "reactNative56"

Praveena
  • 6,340
  • 2
  • 40
  • 53