Angular

Optimizar “Splash Screen” Ionic 4

Últimamente he estado desarrollando una aplicación con ionic 3, después de tratar con angular a nivel web , usar ionic resulta relativamente sencillo si quieres pasar tu App a mobile.

El tema es que todo va de maravilla hasta que te encuentras con los primeros problemas a solucionar ( como siempre ) , esta vez se trataba de la imagen de presentación que ionic nos ofrece mediante el plugin Splashscreen.

La imagen se mostraba y ocultaba bien, pero dejaba un letargo de 3 segundos, donde solo se ve un pantallazo en blanco hasta que se muestra la primera vista de mi aplicaron.

Esto que decir que no me gustaba nada y así que me puse a investigar por la red posibles soluciones.

Encontré una en la que cambiando algunas configuraciones referentes al SplashSreeen en el config.xml conseguimos que la imagen no se auto oculte antes de que la aplicación muestre su primera vista , ademas de algún efecto mas de “fade out” al salir.

Ahora si quedaba perfecta nuestra bienvenida, la pantalla de presentación se muestra y después se oculta justo antes de cargarse la UI.

El código que he usado y  a mi me va perfecto, es este .No dudéis en trastear y probar posibles configuraciones que se ajusten más a tu aplicación:

config.xml:

 <preference name="AutoHideSplashScreen" value="false" />
 <preference name="SplashScreenDelay" value="10000" />
 <preference name="FadeSplashScreenDuration" value="1000" />
 <preference name="SplashScreen" value="screen" />
 <preference name="ShowSplashScreen" value="true" />
 <preference name="ShowSplashScreenSpinner" value="false" />
 <preference name="SplashShowOnlyFirstTime" value="false" />
 <preference name="FadeSplashScreen" value="true" />

Espero que a los que tengáis problemas parecidos esto os ayude como hizo conmigo.

Un saludo.