Brief black screen when loading tabs page for the first time


I’m having a bit of a user-experience issue because a black screen shows briefly when the user is being directed to a tabs-page for the first time. I have a main-tabs-container, which has 5 tabs on the bottom. Two of the tabs in this main-tabs-container load up two separate tabbed-pages (placed on top).

My app starts with some introduction slides using the ion-slides pager component. On the final slide, the user taps a button that takes him to the main-tabs-container (by setting navCtrl.setRoot(main-tabs-container)). This transition is the one that I’m talking about. The user first sees a black screen, and once the main-tabs-container has loaded up, the black screen goes away. The same problem also happens when the user clicks on one of the tabs that load up another tabbed-pages. This problem only happens when the tapped-pages are loaded up for the very first time.

I have been going nuts trying to solve this issue but no luck yet!

I am using ionic 3.19.0 and cordova 7.1.0.

Any help will be deeply appreciated. Thanks :slight_smile: