[V2][Android] Splash screen pops up twice

[el-lsan]

Issue Description

I'm trying to show a loading screen (app.loadingScreen in code snippet) while my redux store is being rehydrated, then navigate to my main screen (app.homeScreen in code snippet) But for some reason the splash screen is showing up between my loading component and main component.

Code Snippets and Screenshots

Navigation.events().registerAppLaunchedListener(() => {
  bootstrap();
});

async function bootstrap() {
  // this function is registering all of my screens using Navigation.registerComponentWithRedux
  registerScreens(store, provider);

  // Navigate to loading screen as the first screen of the app
  Navigation.setRoot({
    root: {
      stack: {
        id: 'splash',
        children: [{
          component: {
            name: 'app.loadingScreen',
            options: {
              topBar: {
                drawBehind: true,
                visible: false,
                animate: false,
              },
            },
          },
        }],
      },
    },
  });

  // Loads resources and persist and rehydrate my redux store using redux-persist
  await Promise.all([loadIcons(), persistStore(store)]).then(() => {
   // Navigate to home screen once the store is rehydrated
    Navigation.setRoot({
      root: {
        stack: {
          id: 'root',
          children: [{
            component: {
              name: 'app.homeScreen',
            },
          }],
        },
      },
    });
  });  
}

On Android the splash screen is flashing before the second Navigation.setRoot

However on IOS everything is as expected:

`

---

Environment

• React Native Navigation version: ^2.16.0
• React Native version: ^0.59.4
• Platform(s) (iOS, Android, or both?): Android
• Device info (Simulator/Device? OS version? Debug/Release?): All

[support[bot]]

We use the issue tracker exclusively for bug reports and feature requests. This issue appears to be a general usage or support question. Instead, please ask a question on Stack Overflow with the react-native-navigation tag.

[el-lsan]

@ItsNoHax I believe this is more like a bug than a question!

[dvill03]

In android, this happens because a modal is opened before the SplashScreen.hide() condition is met. Basically it shows SplashScreen -> Modal -> SplashScreen -> condition for closing modal -> HomeScreen

Or you can also call SplashScreen.hide() inside right before you render the modal. That should stop the splash screen from showing again after the modal takes over.