sábado, 17 de enero de 2015

Splash Screen con Android

Una Splash Screen o pantalla de bienvenida es un elemento de control gráfico que consta de una ventana que contiene una imagen, un logo y la versión actual del software. Una pantalla de bienvenida aparece generalmente mientras que un juego o programa se está lanzando. El término también puede ser usado para describir una página de introducción en un sitio web (en cuyo caso se refiere a menudo como un "splash page".


Hoy crearemos un Splash Screen en android, para ser más preciso lo haremos con eclipse. Comencemos

Abrimos Eclipse y creamos un nuevo proyecto de android. Como nombre le pondremos Splash_Activity.
En la siguiente imagen vemos un ejemplo para entender más lo que se esta haciendo. Al finalizar presionamos Next.


Esta es la parte en donde elegiremos un icono para nuestra aplicación el cual se mostrara al instalar la apk en cualquier dispositivo con android. También podemos dejar el que tiene por defecto, yo en mi caso opte cambiarlo por otro y de la misma forma al terminar presionamos Next. A continuación les dejo la imagen guía.


Seleccionamos una actividad en blanco, es la primera opción. seguir la imagen por favor. Next al finalizar.


Como nombre a esta Actividad la llamaremos SplashActivity. Ustedes pueden poner el nombre que gusten pero recomiendo seguir el ejemplo si aun no están muy familiarizados con esto. Ahora si podemos presionar Finalizar (Finish).

En nuestro layout llamado activity_splash tendremos este diseño, así se vera nuestro splash screen al ser lanzado. Dejo la imagen de muestra y el código del respectivo layout.


Poner este codigo en activity_splash.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#0069E0"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.splash_activity.SplashActivity" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
         />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:src="@drawable/logotipo" />

</RelativeLayout>


Ahora en la clase SplashActivity se contendrá todo el código que lanzara el layout ya creado.Dejo un ejemplo y debajo todo el código. 
Para lo que no entiendan muy bien, les dejare un link en la parte de abajo donde puedan descagar el proyecto completo.


package com.example.splash_activity;

import java.util.Timer;
import java.util.TimerTask;


import android.app.Activity;
import android.content.Intent;
import android.content.pm.ActivityInfo;
import android.os.Bundle;
import android.view.Window;


public class SplashActivity extends Activity {
// Coloca la duracion que durará el Splash Screen ( 1000 = 1 segundo )
    private static final long SPLASH_SCREEN_DELAY = 2000;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Se coloca la Orientación de pantalla
        setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
        // Aqui se oculta la barra de titulo 
        requestWindowFeature(Window.FEATURE_NO_TITLE);

        setContentView(R.layout.activity_splash);

        TimerTask task = new TimerTask() {
            @Override
            public void run() {
             // Al finalizar le indicamos que inicie el siguiente Activity
                Intent mainIntent = new Intent().setClass(
                        SplashActivity.this, Inicio.class);
                startActivity(mainIntent);

                
                // Algo importante: Al presionar el boton de regreso saltara el splash finalizando la aplicación
                finish();
                
            }
        };

        // Simular un proceso de carga al iniciar la aplicación 
        Timer timer = new Timer();
        timer.schedule(task, SPLASH_SCREEN_DELAY);
    }
   
}

 Una vez todo este listo nos dara un error en esta parte " Intent mainIntent = new Intent().setClass(
 SplashActivity.this, Inicio.class); " para mas precico en "Inicio" y eso es porque aun no hermos creado la  clase con ese nombre, pero es justo lo que aremos ahora.

Clic derecho a la carpera src dentro del proyecto >> New >> Other >>


Android Activity y presionamos Next.


Creamos una Actividad en Blanco. Nuevamente Next.


Le asignamos el nombre de Inicio. Presionamos Finalizar (Finish).


En la clase inicio no programaremos nada solo fue creada para ser mostrada una ves que el splash screen finalizara. Sin embargo agregue un imageView  en el layout respectivo de la clase inicio para que no estuviera vació. Debajo el código.


Poner este codigo en activity_inicio.xml


<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.splash_activity.Inicio" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:src="@drawable/logotipo2" />

</RelativeLayout>

Una vez listo esto corremos nuestro emulador y probamos nuestro proyecto.
Mostrara nuestro splash durante dos segundos y luego nos lanzara la actividad definida como inicio.


Bueno esto es todo espero que mi ejemplo les funcione y sobre todo que sea entendible. Acontinuacion el proyecto para poder descargarlo. Importante: Nesecitan la versión 4.3 de android instalada en su eclipse o Android Studio para poder ejecutar el proyecto.

Ver Ejemplo:





No hay comentarios.:

Publicar un comentario