Ver animación

Prueba el método de Compose

Jetpack Compose es el kit de herramientas de IU recomendado para Android. Aprende a usar animaciones en Compose.

Anima propiedades →

Puedes usar el sistema de animación de vista para realizar animaciones interpoladas en vistas. La animación de interpolación calcula la animación con información como el punto de inicio, el punto de finalización, el tamaño, la rotación y otros aspectos comunes de una animación.

Una animación de interpolación puede realizar una serie de transformaciones simples (de posición, tamaño, rotación y transparencia) en el contenido de un objeto de View. Por lo tanto, si tienes un objeto TextView, puedes mover, girar, aumentar o encoger el texto. Si tiene una imagen de fondo, esta se transformará junto con el texto. El animation package proporciona todas las clases que se usan en una animación de interpolación.

Una secuencia de instrucciones de animación define la animación de interpolación, que se define mediante código XML o de Android. Al igual que cuando se define un diseño, se recomienda un archivo en formato XML, ya que es más legible, intercambiable y reutilizable que la animación hard-coded. En el siguiente ejemplo, utilizamos XML. (Para obtener más información sobre cómo definir una animación en el código de la aplicación, en lugar de XML, consulta la clase AnimationSet y otras subclases Animation).

Las instrucciones de animación definen las transformaciones que quieres que ocurran, cuándo se producirán y cuánto tiempo deberían tardar en aplicarse. Las transformaciones pueden ser secuenciales o simultáneas; por ejemplo, puedes hacer que el contenido de un TextView se mueva de izquierda a derecha y luego gire 180 grados, o puedes hacer que el texto se mueva y gire de forma simultánea. Cada transformación toma un conjunto de parámetros específicos para esa transformación (tamaño inicial y final para el cambio de tamaño, ángulo inicial y final para la rotación, etcétera), y también un conjunto de parámetros comunes (por ejemplo, tiempo de inicio y duración). Para que varias transformaciones ocurran simultáneamente, asigna la misma hora de inicio. Para que sean secuenciales, calcula el tiempo de inicio más la duración de la transformación anterior.

El archivo en formato XML de la animación debe encontrarse en el directorio res/anim/ de tu proyecto de Android. El archivo debe tener un único elemento raíz: puede ser un único elemento <alpha>, <scale>, <translate>, <rotate>, interpolador o elemento <set> que contenga grupos de estos elementos (que pueden incluir otro <set>). De forma predeterminada, todas las instrucciones de animación se aplican simultáneamente. Para que se produzcan de forma secuencial, debes especificar el atributo startOffset, como se muestra en el siguiente ejemplo.

El siguiente XML de una de las demostraciones de API se usa para estirar y luego girar y rotar un objeto View al mismo tiempo.

<set android:shareInterpolator="false">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="1.0"
        android:toXScale="1.4"
        android:fromYScale="1.0"
        android:toYScale="0.6"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="700" />
    <set android:interpolator="@android:anim/decelerate_interpolator">
        <scale
           android:fromXScale="1.4"
           android:toXScale="0.0"
           android:fromYScale="0.6"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400"
           android:fillBefore="false" />
        <rotate
           android:fromDegrees="0"
           android:toDegrees="-45"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400" />
    </set>
</set>

Las coordenadas de la pantalla (que no se usan en este ejemplo) son (0,0) en la esquina superior izquierda y aumentan a medida que avanzas hacia abajo y hacia la derecha.

Algunos valores, como pivotX, se pueden especificar en relación con el objeto en sí o con el elemento superior. Asegúrate de usar el formato adecuado para lo que deseas ("50" para 50% en relación con el elemento superior o "50%" para 50% en relación con sí mismo).

Puedes determinar cómo se aplica una transformación a lo largo del tiempo si asignas un Interpolator. Android incluye varias subclases de Interpolator que especifican diferentes curvas de velocidad; por ejemplo, AccelerateInterpolator le indica a una transformación que comience lentamente y acelere después. Cada una tiene un valor de atributo que se puede aplicar en el XML.

Con este XML guardado como hyperspace_jump.xml en el directorio res/anim/ del proyecto, el siguiente código hará referencia a él y lo aplicará a un objeto ImageView desde el diseño.

AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump).also { hyperspaceJumpAnimation ->
    findViewById<ImageView>(R.id.spaceshipImage).startAnimation(hyperspaceJumpAnimation)
}

ImageView spaceshipImage = (ImageView) findViewById(R.id.spaceshipImage);
Animation hyperspaceJumpAnimation = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
spaceshipImage.startAnimation(hyperspaceJumpAnimation);

Como alternativa a startAnimation(), puedes definir un tiempo de inicio para la animación con Animation.setStartTime() y, luego, asignar la animación a la vista con View.setAnimation().

Para obtener más información sobre la sintaxis XML y las etiquetas y los atributos disponibles, consulta Recursos de animación.

Nota: Independientemente de cómo se pueda mover o cambiar el tamaño de la animación, los límites de la vista que contiene tu animación no se ajustarán automáticamente para adaptarse a ella. Aun así, se dibujará la animación más allá de los límites de su vista y no se recortará. Sin embargo, se producirá un recorte si la animación excede los límites de la vista principal.