crear un splash-screen - aureliux · el “splashscreen” es una pantalla que carga justo cuando...
TRANSCRIPT
Aurelio López Ovando - http://aureliux.wordpress.com 1
Crear un Splash-Screen
El “splashscreen” es una pantalla que carga justo cuando se abre la aplicación y que generalmente tiene algún aviso que indica
al usuario que algo está sucediendo mientras se carga el sistema o simplemente un mensaje de bienvenida, acompañanada por
lo general de alguna imagen comúnmente el logotipo.
En este ejemplo realmente veremos dos cosas:
1. Como utilizar insertar una imagen en una pantalla.
2. Como crear un splashScreen.
Primeramente crearemos un proyecto de android, en este caso le pondremos como nombre “SplashScreenDemo”, seguimos
las pantallas iniciales, hasta llegar al “activity” principal .
Hasta este punto tenemos un activity al que pusimos
como nombre “Principal”.
El splashScreen es otro activity, por lo tanto hay que crearlo y configurarlo de la manera
en que queramos o necesitemos, pero antes de crearlo debemos considerar que
necesitamos una imagen para mostrarla en esa pantalla, así que primeramente
ocupémonos de ver como agregar una imagen al proyecto.
Lo hacemos como se describe a continuación:
Buscamos la carpeta “res” esta carpeta, como ya sabemos (o deberíamos), contiene los recursos externos
a utilizar en el proyecto, al decir recursos externos, me refiero a: imágenes, audios, videos, íconos, etc…,
pues bien, en esa carpeta debemos colocar los archivos de los recursos a utilizar.
En este caso específico, debemos tener la imagen que queremos mostrar, si desplegamos la estructura
de carpetas veremos que tiene: drawable-hdpi, darwable-ldpi, layout, etc… cada una con una función
específica, para no generar confusiones lo más adecuado será crear nuestra propia carpeta y de ahí
colocar nuestras imágenes, a esta nueva carpeta le llamaremos “drawable”.
Aurelio López Ovando - http://aureliux.wordpress.com 2
Para ellos damos clic derecho sobre la carpeta “res” y “New -> folder”.
En la ventana que aparece escribimos el nombre de la carpeta, que para
este caso(como ya mencionamos anteriormente) la llamaremos
“drawable” y pulsamos en el botón finish, como se muestra en la figura.
Ahora debemos tener una nueva subcarpeta
dentro de la carpeta res, lo que ocupa ahora
es agregar los archivos que necesitamos a
dicha subcarpeta.
Una manera sencilla de hacerlo es arrastrando la imagen deseada desde una carpeta de explorador de Windows hasta esta
carpeta “drawable” en eclipse, cuestión de acomodar las ambas ventanas para poder hacerlo sin complicaciones.
Si lo hacemos de manera correcta nos aparece un cuadro de diálogo preguntándonos si queremos copiar el archivo a lo cual
diremos que “sí” marcando la opción “Copy files”, podríamos arrastrar más de un archivo a la vez si así lo quisiéramos.
Y con esto ya tenemos nuestro archivo de imagen dentro de la carpeta
de recursos.
Aurelio López Ovando - http://aureliux.wordpress.com 3
Ahora si ya podemos crear nuestra pantalla de presentación o bienvenida a la que conocemos como “splash screen”.
Para crear un nueco activity debemos dar clic derecho sobre la carpeta “layout” y escogemos la opción: “New -> Other” y de la
ventana que aparece escogemos la opción “Android activity” pulsamos botón “Next” creamos una activity en blanco(Blank
Activity) y le pondremos como nombre: “SplashScreen” y pulsamos el botón “Finish”.
Lo que podremos observar de manera inmediata es que la carpeta
layout contiene ahora un nuevo archivo aparte de principal.xml,
ahora contiene el que acabamos de crear.
Si lo abrimos tendremos una nueva pantalla a la cual le
insertaremos la imagen que agregamos hace un instante, así que
damos clic sobre este archivo.
De manera predeterminada traerá un texto inicial (TextView)
podemos eliminarlo sin ningún problema o podemos modificarlo por uno que diga bienvenido al sistema a través de los strings.
Ahora coloquemos sobre esta pantalla un “ImageView” que se encuentra dentro de la sección
“Image& media” al colocarlo sobre la pantalla inmediantemente nos pedirá que elijamos la
imagen que queremos colocar y nos mostrará la imagen que subimos hace un momento, la cual
debemos seleccionar.
Aurelio López Ovando - http://aureliux.wordpress.com 4
Y listo, hemos colocado una imagen sobre la pantalla
Ahora lo que queda es la parte del código, hacer que aparezca primero la pantalla de bienvenida, se detenga un instante y
luego desaparezca dando paso a la pantalla principal de la aplicación.
Abrimos “SplashScreen.java” y modificamos el código como se muestra:
package alo.aur3liux.splashscreendemos; import java.util.Timer; import java.util.TimerTask; import android.app.Activity; import android.content.Intent; import android.os.Bundle; import android.view.Menu; public class SplashScreen extends Activity { //Tiempo en milisegundos que durará la pantalla de bienvenida private long retardoPantalla = 4000; //4000 milisegundos equivale a 4 segundos. @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.splash_screen); //Lanzamos la pantalla de bienvenida TimerTask task = new TimerTask() { @Override public void run() { Intent pantallaInicial = new Intent().setClass(SplashScreen.this, Principal.class); startActivity(pantallaInicial); finish(); //Lo destruimos para evitar regresar presionando el boton atras } }; Timer t = new Timer(); t.schedule(task, retardoPantalla); //Aqui se detiene 4 segundos } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.splash_screen, menu); return true; } }
Aurelio López Ovando - http://aureliux.wordpress.com 5
Ahora buscamos al archivo “AndroidManifiest.xml” y damos click donde dice “XML Source” y nos muestra el código
correspondiente, ahí debemos modificar como se muestra:
Se guardan todos los cambios y al correr la aplicación podremos ver la pantalla de bienvenida.
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="alo.aur3liux.splashscreendemos" android:versionCode="1" android:versionName="1.0" > <uses-sdk android:minSdkVersion="8" android:targetSdkVersion="17" /> <application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme" > <activity android:name="alo.aur3liux.splashscreendemos.SplashScreen" android:label="@string/app_name" android:theme="@android:style/Theme.NoTitleBar.Fullscreen"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name="alo.aur3liux.splashscreendemos.Principal" android:label="@string/title_activity_splash_screen" > </activity> </application> </manifest>