question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

White screen after splash screen

See original GitHub issue

Capacitor displays my custom splash screen as normal, however it will always display a white screen next, before finally navigating to the first route page. Routing module: const routes: Routes = [ { path: '', redirectTo: '/welcome', pathMatch: 'full' }, { path: 'app', loadChildren: './pages/tabs/tabs.module#TabsPageModule', canActivate: [AuthGuardService] }, { path: 'welcome', loadChildren: './pages/welcome/welcome.module#WelcomePageModule' }, ]

init function from app.ts

`async initializeApp() {

    this.platform.ready().then(async () => {

      try {

        this.statusBarService.setStatusBar('light');

        SplashScreen.hide();

        console.log('App is ready to go!');

      } catch (error) {
        console.log('Capacitor Warn: Some plugins do not yet have web support');
      }
    });
  }`

It is not a nice look for the app. Is there a particular reason it does this? Maybe something to do with the lazy loading?

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:4
  • Comments:27 (1 by maintainers)

github_iconTop GitHub Comments

4reactions
oliverandersencoxcommented, Jan 13, 2020

@jcesarmobile I am still having this issue. My app has this config, yet the white webview always blinks before rendering my initial page. I have created a splash screen page with animation and so this blinking white really ruins the affect!

`{
  "appId": "com.app.ping",
  "appName": "Ping",
  "bundledWebRuntime": false,
  "webDir": "www",
  "server": {
    "allowNavigation": [
      "capacitor://localhost",
      "ionic://localhost",
      "http://localhost",
      "http://localhost:8080",
      "http://localhost:8100"
    ]
  },
  "plugins": {
    "SplashScreen": {
      "launchAutoHide": false,
      "showSpinner": true,
      "androidSplashResourceName": "splash",
      "androidScaleType": "CENTER_CROP",
      "androidSpinnerStyle": "small",
      "iosSpinnerStyle": "small",
      "spinnerColor": "#ffffff",
      "backgroundColor": "#34ace0"
    },
    "PushNotifications": {
      "presentationOptions": [
        "sound"
      ]
    }
  },
  "npmClient": "npm"
}
`
3reactions
oliverandersencoxcommented, Jun 4, 2020

adding “launchShowDuration”: 3000 fixed my issue

Read more comments on GitHub >

github_iconTop Results From Across the Web

Why white screen stuck after splash screen in Ionic 4?
So solution is to request permissions after splashScreen.hide() after timeout delay equal to fade out timeout. example: config.xml <preference ...
Read more >
White screen after splash and before my home ... - Ionic Forum
Hey, I upgraded my old cordova app to capacitor app, everything is working fine but I am seeing a white screen between splashscreen...
Read more >
EAS - white screen after splash-screen in production mode on ...
Everything should be fine in production. There should be a white screen after the splashscreen, which might be very quick in a blank...
Read more >
[SOLVED] White screen after splash screen - Questions
Hi. After splash screen loads, a white screen appears in app. I used chrome to inspect error but there is no error.
Read more >
white screen after splash screen phonegap ios - Google Groups
I had a similar issue. Check that your splash screen files are in the correct directory - that they match your config.xml.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found