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 agregan un aspecto refinado a tu app, lo que le brinda un aspecto de mayor calidad.
Android incluye diferentes APIs de Animation según el tipo de animación que desees. En esta documentación, se proporciona una descripción general de las diferentes formas en que puedes agregar movimiento a tu IU.
Para comprender mejor cuándo debes usar animaciones, consulta también la guía de movimiento de Material Design.
Cómo animar mapas de bits
Figura 1: Elemento de diseño animado.
Para animar un gráfico de mapa de bits, como un ícono o una ilustración, usa las APIs de animación de elementos de diseño. Por lo general, estas animaciones se definen de forma estática con un recurso de elementos de diseño, pero también puedes definir el comportamiento de la animación en el tiempo de ejecución.
Por ejemplo, una buena manera de comunicarle al usuario que dos acciones están relacionadas es animar un botón de reproducción que se transforme en un botón de pausa cuando se lo presione.
Para obtener más información, consulta 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.
Cuando necesites cambiar la visibilidad o la posición de las vistas en tu diseño, te recomendamos que incluyas animaciones sutiles que ayuden al usuario a comprender cómo cambia la IU.
Para mover, ocultar o mostrar vistas en el diseño actual, puedes usar el sistema de animación de propiedades que proporciona el paquete android.animation, disponible en Android 3.0 (nivel de API 11) y versiones posteriores. Estas APIs actualizan las propiedades de tus objetos View durante un período y dibujan la vista de forma continua a medida que cambian las propiedades. Por ejemplo, cuando cambias las propiedades de posición, la vista se mueve por la pantalla. Cuando cambias la propiedad alfa, se produce un fundido de entrada o de salida en la vista.
Para crear estas animaciones de la manera más sencilla, habilítalas en tu diseño de manera que, cuando cambies la visibilidad de una vista, se aplique una animación automáticamente. Para obtener más información, consulta Cómo animar automáticamente las actualizaciones de diseño.
Si deseas aprender a compilar animaciones con el sistema de animación de propiedades, consulta la Descripción general de la animación de propiedades. También puedes consultar las siguientes páginas para crear animaciones comunes:
Cambia 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 APIs basadas en la física.
Siempre que sea posible, aplica física del mundo real a tus animaciones para que se vean naturales. Por ejemplo, deben mantener el impulso cuando cambia su objetivo y realizar transiciones fluidas durante cualquier cambio.
Para proporcionar estos comportamientos, la biblioteca de compatibilidad de Android incluye APIs de animación basadas en la física que dependen de las leyes de la física para controlar cómo ocurren 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 APIs de ObjectAnimator, son bastante estáticas y tienen una duración fija. Si el valor objetivo cambia, debes cancelar la animación cuando cambie el valor objetivo, volver a configurar la animación con un nuevo valor como el valor de inicio nuevo y agregar este último. En términos visuales, este proceso crea una parada abrupta en la animación y, luego, un movimiento inconexo, como se muestra en la figura 3.
Las animaciones creadas con APIs de animación basadas en la física, como DynamicAnimation, están impulsadas por la fuerza. El cambio en el valor objetivo da como resultado un cambio de fuerza. La fuerza nueva se aplica a la velocidad existente, lo que realiza 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 (nivel de API 19) y versiones posteriores, puedes usar el framework de transición para crear animaciones cuando cambias el diseño dentro de la actividad o el fragmento actual. Lo único que debes hacer es especificar el diseño inicial y final, y el tipo de animación que quieres usar. Luego, el sistema identifica y ejecuta una animación entre los dos diseños. Puedes usar esto 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 por 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 un Scene, aunque, por lo general, la escena de inicio se determina automáticamente a partir del diseño actual. Crea un Transition para indicarle al sistema qué tipo de animación deseas. Luego, llama a TransitionManager.go() y el sistema ejecuta la animación para cambiar los diseños.
Para obtener más información, consulta Cómo animar cambios de diseño con una transición. Para ver el código de muestra, consulta BasicTransition.
Cómo animar entre actividades
En Android 5.0 (nivel de API 21) y versiones posteriores, también puedes crear animaciones que hagan la transición entre tus actividades. Este proceso se basa en el mismo framework de transición descrito en la sección anterior, pero te permite crear animaciones entre diseños en actividades separadas.
Puedes aplicar animaciones simples, como deslizar la actividad nueva desde el lado o atenuarla, pero también puedes crear animaciones que hagan la transición entre las vistas compartidas de cada actividad. Por ejemplo, cuando el usuario presiona un elemento para ver más información, puedes hacer la transición a una nueva actividad con una animación que expanda ese elemento sin problemas para 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 que proporciona ActivityOptions.makeSceneTransitionAnimation().
Este conjunto de opciones puede incluir qué vistas se comparten entre las actividades para que el framework de transición pueda conectarlas durante la animación.
Para obtener recursos adicionales, consulta los siguientes vínculos: