Annoying flicker when app loads in native ios app

ionic-v1
1

Hi, i’ve been playing around with ionic and have the sidebar app working on iOS. I’ve got the same issue i get with most hybrid app framework.

When the app first loads the app kicks in but there is a small flicker when rendering the html. Namely the sidebar button and the header title. Its fine after the app loads. It’s something i’ve come across in most hybrid app platforms and its pretty easy to just make the splashscreen hang around a bit for a few seconds after deviceready but i’m pretty sure there has to be a neater way.

This happens on the default app downloaded from ionic and also when i update the code to trigger on deviceready. Has anyone got a better fix that only shows the app once the front end fullt rendered?

2

The best way I’ve seen people getting around this is set a $timeout function that hides the splash screen after deviceready, like you have said

.run(function($ionicPlatform, $timeout) {
  $ionicPlatform.ready(function() {
   
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }

    if(window.StatusBar) {
      StatusBar.styleDefault();
    }

    $timeout (function (){
      navigator.splashscreen.hide();
    },750);

  });
})