Animaciones entre Activities

¬ę-¬ŅC√≥mo hago para animar el cambio de clase? -¬ŅC√≥mo creo animaciones entre Intents? -¬ŅC√≥mo‚Ķ.?¬Ľ No paro de recibir e-mails, privados en Twitter y Facebook pregunt√°ndomelo. Querido programador, hoy vengo a calmar tu ansia, y a ense√Īarte a crear animaciones entre Activities de manera sencilla utilizando una librer√≠a. ¬ŅEmpezamos?

Para este ejemplo crear√°s un nuevo proyecto en Android Studio, un proyecto sencillo que constar√° de 2 (o quiz√°s 3) Activities.

Crea el proyecto seleccionando una Activity vac√≠a, ya que para el ejemplo no vamos a centrarnos en la apariencia. En la siguiente pantalla dale un nombre al proyecto y un nombre al paquete. En lenguaje asegurate de tener seleccionada la opci√≥n ¬ęJAVA¬Ľ.

Una vez el proyecto est√© preparado para empezar a escribir en √©l, deber√°s a√Īadir la siguiente l√≠nea al archivo build.gradle(app):

De manera que te debería quedar así:

Por otro lado, en el archivo build.gradle(Project), deber√°s a√Īadir la dependencia de jetpack.io en ¬ęallprojects¬Ľ. Para ello copia y pega la siguiente l√≠nea en el sitio indicado:

Debería quedarte así:

Bien, ahora puedes volver al archivo build.gradle(app) y pulsar en ¬ęSync now¬Ľ arriba a la derecha. Para que el proyecto descargue las nuevas dependencias que le acabas de a√Īadir.

Ahora s√≠, ya lo tienes todo listo para empezar a escribir. Primero de todo, en nuestro activity vamos a necesitar un bot√≥n. Ser√° el bot√≥n m√°gico que mostrar√° una segunda Activity. As√≠ que para crearlo, vas a abrir el archivo ¬ęactivity_main.xml¬Ľ y vas a a√Īadir debajo del ¬ęTextView¬Ľ el siguiente c√≥digo:

Esto generará un botón en tu interfaz y lo situará justo debajo del textview que viene por defecto. Debería de quedarte así:

Ya tienes el bot√≥n que abrir√° el nuevo activity, ahora solo falta crear el segundo activity. Para ello debes ir al men√ļ ¬ęFile>New>Activity>Basic Activity¬Ľ, seguidamente ver√°s una ventana igual a la que viste al crear el primer Activity. Aqu√≠ en principio no se deber√≠a tocar nada, solo dar clic en ¬ęFinish¬Ľ.

Bien, ya tienes el primer Activity con el botón y el segundo Activity creado. Ahora toca darle función a ese botón.

Antes de nada, es importante que para utilizar la librer√≠a que has a√Īadido previamente, hagas un import en la parte superior del archivo. A√Īade la siguiente l√≠nea despu√©s del √ļltimo Import que tengas:

En el archivo MainActivity.java tendr√°s que crear diferentes variables y objetos:

Como ves, simplemente declaras un Intent que te permitir√° pasar de un Activity a otro, el bot√≥n ¬ę_btn_abrir¬Ľ para que puedas darle funci√≥n al bot√≥n, y una lista de 6 Strings que te servir√°n para seleccionar un tipo de animaci√≥n u otra.

En el método onCreate de MainActivity copia y pega lo siguiente:

Voy a repasar l√≠nea por l√≠nea las funciones. Primero de todo se da el valor a ¬ęi¬Ľ, creando el Intent y pas√°ndole como primer par√°metro el Context de nuestro Activity actual, y como segundo par√°metro el Activity que se abrir√°.

En la segunda l√≠nea, asignamos el bot√≥n de nuestra interfaz a la variable ¬ę_btn_abrir¬Ľ para poder manipularlo. Seguidamente creamos el m√©todo ¬ę.setOnClickListener()¬Ľ, con el que controlaremos el evento que se produce al pulsarlo.

Una vez ya dentro del onClick(), con ¬ęstartActivity(i)¬Ľ se iniciar√≠a la transici√≥n, pero t√ļ a√Īadiras la funci√≥n ¬ęcustomType()¬Ľ, que es propia de la librer√≠a que has importado al principio. A esta funci√≥n hay que pasarle 2 par√°metros, el primero es el Contexto del activity actual, y el segundo ser√° una de las 6 variables tipo String que has declarado al principio del archivo.

Prueba a compilar el c√≥digo y ver√°s el resultado. Si has utilizado ¬ęanimacion_1¬Ľ en la funci√≥n customType() deber√≠as ver algo parecido a esto:

Como habr√°s podido apreciar, en mi segundo Activity aparece la ¬ęflechita¬Ľ para volver atr√°s. ¬ŅPor qu√© a t√≠ no te sale? Esto es debido a que, cuando creabas el segundo Activity, hab√≠a una opci√≥n para determinar si el Activity que est√°s creando es ¬ęhijo¬Ľ de alguno ya creado. La opci√≥n en concreto es ¬ęHierarchical Parent¬Ľ. Puedes repetir el proceso de crear un nuevo Activity, y m√°rcale el Activity ¬ęPadre¬Ľ pulsando en los 3 puntitos que aparecen al lado derecho.

¬ŅQue te ha parecido este art√≠culo sobre animaciones entre Activities? Si te ayudado no dudes en compartirlo, y si tienes alguna duda puedes dejarme un comentario m√°s abajo o escribirme en Twitter @mscdroidlabs

Te dejo el código del MainActivity completo:

Mario Camí

Desarrollador de aplicaciones Android. Amante de todo lo Open Source, de los videojuegos y nuevas tecnologías. En mi tiempo libre comparto todo lo aprendido y lo que aprendo en el desarrollo de Android a modo de artículo en el blog. La información nos hará libres!

También te podría gustar...

Veces compartido
¬°No te pierdas ning√ļn art√≠culo!

Suscríbete a nuestro newsletter semanal y serás el primerio en enterarte de todo el nuevo contenido del blog.