En las animaciones, se pueden agregar elementos visuales que informen a los usuarios sobre lo que sucede en tu app. Son particularmente útiles cuando la IU cambia de estado, como cuando se carga contenido nuevo o cuando hay acciones nuevas disponibles. Las animaciones también le dan un aspecto acabado a tu app, que se traduce en una apariencia y estilo de mayor calidad.
Android incluye diferentes API de animación según el tipo de animación que desees. En esta página, podrás ver una descripción general de las diferentes maneras de agregar movimiento a tu IU.
Para comprender mejor cuándo debes usar animaciones, consulta la guía de material design sobre movimiento.
Cómo animar mapas de bits
Figura 1: Elemento de diseño animado
Si deseas animar un gráfico de mapa de bits como un ícono o una ilustración, debes usar API de animación de elementos de diseño. Por lo general, estas animaciones se definen de manera estática con un recurso de diseño, aunque también puedes definir el comportamiento de la animación en el tiempo de ejecución.
Por ejemplo, animar un botón de reproducción para que se transforme en un botón de pausa cuando lo presionas es una manera efectiva de comunicarle al usuario que las dos acciones están relacionadas y que presionar una deja visible a la otra.
Para obtener más información, lee Cómo animar gráficos con elementos de diseño.
Cómo animar la visibilidad y el movimiento de la IU
Figura 2: Una animación sutil cuando aparece y desaparece un diálogo hace que el cambio de la IU sea menos molesto
Si necesitas cambiar la visibilidad o la posición de las vistas en tu diseño, debes incluir animaciones sutiles que le ayuden al usuario a entender los cambios de la IU.
Para mover, ocultar o mostrar vistas en el diseño actual, puedes usar el sistema de animación de propiedades del paquete de android.animation, disponible en Android 3.0 (API nivel 11) y versiones posteriores. Estas API actualizan las propiedades de tus objetos View durante un período y dibujan la vista de manera continua a medida que cambian las propiedades. Por ejemplo, cuando cambias las propiedades de posición, la vista se mueve por la pantalla, o bien cuando cambias la propiedad Alfa, se agrega un fundido de entrada o salida a la vista.
Para crear estas animaciones con el menor esfuerzo posible, puedes habilitar las animaciones en tu diseño, de manera que cuando cambias la visibilidad de una vista, se aplique una animación automáticamente. Si deseas obtener más información, consulta Cómo animar automáticamente actualizaciones de diseño.
Si deseas obtener información sobre cómo crear animaciones con el sistema de animación de propiedades, consulta Descripción general de animación de propiedades. También puedes visitar las siguientes páginas sobre cómo crear animaciones comunes:
Cómo cambiar la visibilidad de una vista con un efecto revelar circular
Cómo cambiar el tamaño de la vista con una animación de zoom
Movimiento basado en la física
Figura 3: Animación creada con ObjectAnimator
Figura 4: Animación creada con API basadas en la física
Siempre que sea posible, tus animaciones deben usar física del mundo real para que se vean naturales. Por ejemplo, deben conservar el impulso cuando cambia su objetivo y mostrar transiciones fluidas durante los cambios.
A fin de ofrecer estos comportamientos, la biblioteca de compatibilidad de Android incluye API de animación basadas en la física que utilizan las leyes de la física para controlar tus animaciones.
Dos animaciones comunes basadas en la física son las siguientes:
Las animaciones no basadas en la física, como las compiladas con las API de ObjectAnimator, son bastante estáticas y tienen una duración fija. Si el valor del objetivo cambia, debes cancelar la animación en ese momento, volver a configurar la animación con un valor nuevo como el valor de inicio nuevo y agregarlo. Desde un punto de vista visual, este proceso crea una parada abrupta en la animación y un movimiento desarticulado después, como se muestra en la figura 3.
Por otro lado, las animaciones creadas con API de animación basadas en la física, como DynamicAnimation, están impulsadas por la fuerza. El cambio en el valor del objetivo genera un cambio en la fuerza. La fuerza nueva se aplica en la velocidad existente, lo que crea una transición continua al objetivo nuevo. Este proceso da como resultado una animación de aspecto más natural, como se muestra en la figura 4.
Cómo animar los cambios de diseño
Figura 5: Se puede lograr que una animación muestre más detalles, ya sea cambiando el diseño o iniciando una actividad nueva
En Android 4.4 (API nivel 19) y versiones posteriores, puedes usar el marco de trabajo de transición para crear animaciones cuando cambias el diseño desde la actividad o el fragmento actual. Todo lo que necesitas hacer es especificar un diseño de inicio y finalización, y qué tipo de animación quieres usar. Luego, el sistema interpreta y ejecuta la animación entre los dos diseños. Puedes usar este proceso para cambiar toda la IU o para mover o reemplazar solo algunas vistas.
Por ejemplo, cuando el usuario presiona un elemento para ver más información, puedes reemplazar el diseño con los detalles del elemento y aplicar una transición como la que se muestra en la figura 5.
Los diseños de inicio y finalización se almacenan en Scene, aunque, por lo general, la escena de inicio se determina automáticamente a partir del diseño actual.
Luego, creas una Transition para indicarle al sistema el tipo de animación que deseas. A continuación, se llama al TransitionManager.go() y el sistema ejecuta la animación para cambiar los diseños.
Para obtener más información, consulta Cómo animar entre diseños con una transición. Si quieres ver el código de muestra, consulta BasicTransition.
Cómo animar entre actividades
En Android 5.0 (API nivel 21) y versiones posteriores, también puedes crear animaciones que sirvan de transición entre tus actividades. Este proceso se basa en el mismo marco de trabajo de transición que se describió arriba para animar cambios de diseño. Sin embargo, te permite crear animaciones entre diseños en actividades separadas.
Puedes aplicar animaciones simples, como deslizar la actividad nueva desde el costado o atenuarla. También puedes crear animaciones que sirvan de transición entre vistas compartidas en cada actividad. Por ejemplo, cuando el usuario presiona un elemento para ver más información, puedes agregar una transición a una actividad nueva con una animación que aumente de tamaño ese elemento hasta ocupar la pantalla, como la animación que se muestra en la figura 5.
Como siempre, llamas a startActivity(), pero le pasas un conjunto de opciones proporcionadas por ActivityOptions.makeSceneTransitionAnimation(). Este conjunto de opciones puede incluir qué vistas se comparten entre las actividades para que el marco de trabajo de transición pueda conectarlas durante la animación.
Para obtener más información, consulta Cómo iniciar una actividad con una transición. Si quieres ver el código de muestra, consulta ActivitySceneTransitionBasic.