Cómo hacer una pantalla de presentación (Splash)

Muchos de vosotros después de un tiempo pensando, programando y demás ya tendréis lista vuestra aplicación Android para publicar. Aún así queréis darle un toque sofisticado y una de las formas más fáciles de hacer esto es creando una pantalla de presentación que se visualice durante unos pocos segundos y cause una buena sensación al usuario al entrar en la aplicación.
El de hoy es un truco muy rápido y sencillo. Este efecto lo utilizamos en la aplicación que tenemos para leer los artículos del blog en Android, Nosinmiubuntu blog. Lo primero que deberéis hacer es preparar vuestra propia imagen de presentación y guardarla en formato png.



Una vez listo vuestro diseño debéis abrir la imagen con el programa draw9patch. Ya hablamos en alguna ocasión de él en el artículo "Como aplicar estilos a los controles de Android". Lo que debéis hacer es en las esquinas dibujar los patch para que sean estas las que se alarguen y no deformen el logo que normalmente estará en el centro. Cada uno tiene que ir viendo en esta parte cual es la mejor forma para que no afecte a su diseño.

Una vez lista la imagen guardáis el resultado en las carpetas drawable-hdpi, drawable-mdpi... Esto es según las diferentes imágenes que hayáis hecho para adaptar a diferentes densidades de pantalla.

Ahora vamos a preparar un layout, para ello creais en vuestra carpeta layout un nuevo archivo que se llamará splash.xml. El código de este archivo será el siguiente:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_gravity="center" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@drawable/logo">
</LinearLayout>


Como veis aquí únicamente tenemos un LinearLayout que va a ocupar todo el ancho y alto de la pantalla y que además tendrá como background la imagen que ya preparamos y que yo le llamé logo.9.png.

Ahora vamos a crear una activity que será la primera que se vea al iniciar la aplicación, le llamaremos Splash. Veamos como se verá:


public class splash extends Activity {

 protected boolean active = true;
 protected int splashTime = 1000;
  
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.splash);
        
        Thread splashThread = new Thread(){
         @Override
         public void run(){
          try{
           int waited = 0;
           while(active && (waited < splashTime)){
            sleep(100);
            if(active){
             waited += 100;
            }
            
           }
          } catch(InterruptedException e){
           
          } finally{
           openApp();
           stop();
          }
          
         }
        };
        splashThread.start();
    }
    
    private void openApp(){
     finish();
        startActivity(new Intent(this,HelloWorldActivity.class));
    }
 
}


Las primeras líneas del método onCreate obligan a que la pantalla de esta activity esté siempre en posición vertical y que no aparezca la barra de título para que solo se vea nuestra imagen de fondo. A continuación se carga el layout que creamos y finalmente con un Thread lanzamos un proceso que se encargará de contar el tiempo, cuando haya pasado un segundo lanzará la siguiente pantalla.

El método del Thread es muy simple, un contador y un while, mientras el contador no llegue a los 1.000 milisegundos, hacemos un sleep de 100 milisegundos y añadimos 100 a nuestro contador. En el finally se navegue hacia la siguiente activity y se hace un stop del Thread. El método openApp finaliza la activity actual e inicia la siguiente.

Para que nuestra app muestra al inicio de todo esta activity acordaros de modificar el AndroidManifest.xml para que esta sea la activity inicial añadiendo los siguiente parámetros:


<activity android:name=".splash">
 <intent-filter>
      <action android:name="android.intent.action.MAIN" />
      <category android:name="android.intent.category.LAUNCHER" />
 </intent-filter> 
</activity>

Comments are closed.