Ejemplo de Animación en Android

La animación de Android se utiliza para darle a la interfaz de usuario un aspecto y sensación visualmente atractivos. Las animaciones en las aplicaciones de Android se pueden realizar mediante XML o código Android. En este tutorial de animación de Android, utilizaremos códigos XML para agregar animaciones a nuestra aplicación.

Animación de Android

La animación en las aplicaciones de Android es el proceso de crear movimiento y cambios de forma. Las formas básicas de animación que veremos en este tutorial son:

1. Animación de Desvanecimiento (Fade In)
2. Animación de Desvanecimiento (Fade Out)
3. Animación de Desvanecimiento Cruzado (Cross Fading)
4. Animación de Parpadeo (Blink)
5. Animación de Acercamiento (Zoom In)
6. Animación de Alejamiento (Zoom Out)
7. Animación de Rotación (Rotate)
8. Animación de Movimiento (Move)
9. Animación de Deslizamiento hacia Arriba (Slide Up)
10. Animación de Deslizamiento hacia Abajo (Slide Down)
11. Animación de Rebote (Bounce)
12. Animación Secuencial (Sequential)
13. Animación Conjunta (Together)

Ejemplo de Animación de Android en XML

Creamos un directorio de recursos bajo la carpeta res con el nombre anim para almacenar todos los archivos XML que contienen la lógica de animación. A continuación, se muestra un archivo XML de muestra que muestra la lógica del código de animación de Android. sample_animation.xml

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="https://schemas.android.com/apk/res/android"
  android:interpolator="@android:anim/accelerate_decelerate_interpolator"
  android:duration="300"
  android:fillAfter="true"
  android:fromXScale="0.0"
  android:fromYScale="0.0"
  android:toXScale="1.0"
  android:toYScale="1.0" />

• android:interpolator : Es la tasa de cambio en la animación. Podemos definir nuestros propios interpoladores utilizando el tiempo como restricción. En el código xml anterior, se asigna un interpolador incorporado

• android:duration : Duración de la animación en la que la animación debe completarse. Aquí es de 300 ms. Esta es generalmente la duración ideal para mostrar la transición en la pantalla. El inicio y el final de la animación se establecen mediante:

  android:fromTRANSFORMATION
  android:toTRANSFORMATION
  

• TRANSFORMATION : es la transformación que queremos especificar. En nuestro caso, comenzamos con una escala x e y de 0 y terminamos con una escala x e y de 1

• android:fillAfter : la propiedad especifica si la vista debe estar visible u oculta al final de la animación. La hemos configurado como visible en el código anterior. Si se establece en falso, el elemento vuelve a su estado anterior después de la animación

• android:startOffset : Es el tiempo de espera antes de que comience una animación. Esta propiedad se utiliza principalmente para realizar múltiples animaciones de manera secuencial

• android:repeatMode : Esto es útil cuando se desea que la animación se repita

• android:repeatCount : Esto define el número de repeticiones en la animación. Si establecemos este valor en infinito, la animación se repetirá infinitamente

Animación de carga cuando se hace clic en un widget de la interfaz de usuario

Nuestro objetivo es mostrar una animación cuando se hace clic en cualquier widget (digamos TextView). Para eso, necesitamos usar la clase Animation. El archivo XML que contiene la lógica de la animación se carga usando la clase AnimationUtils llamando a la función loadAnimation(). El siguiente fragmento muestra esta implementación.

Animation animation;
animation = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.sample_animation);

Para iniciar la animación, necesitamos llamar a la función startAnimation() en el elemento de la interfaz de usuario, como se muestra en el fragmento a continuación:

sampleTextView.startAnimation(animation);

Aquí realizamos la animación en un componente de TextView pasando el tipo de animación como parámetro.

Configuración de los Escuchadores de Animación

Esto solo es necesario si deseamos escuchar eventos como inicio, fin o repetición. Para esto, la actividad debe implementar AnimationListener y se deben sobrescribir los siguientes métodos.

• onAnimationStart: Esto se activará una vez que la animación haya comenzado
• onAnimationEnd: Esto se activará una vez que la animación haya terminado
• onAnimationRepeat: Esto se activará si la animación se repite

Estructura del Proyecto de Animación de Android

Como puedes ver, hemos incluido el XML de todos los principales tipos de animaciones mencionados anteriormente.

Ejemplos de Código XML de Animaciones en Android

Aquí proporciono un código de muestra para la mayoría de las animaciones comunes en Android.

Animación de Desvanecimiento (Fade In)

fade_in.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true" >

    <alpha
        android:duration="1000"
        android:fromAlpha="0.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toAlpha="1.0" />

</set>

Aquí, alpha hace referencia a la opacidad de un objeto. Un objeto con valores de alpha más bajos es más transparente, mientras que un objeto con valores de alpha más altos es menos transparente, más opaco. La animación de desvanecimiento consiste en aumentar el valor de alpha de 0 a 1.

Animación de Desvanecimiento (Fade Out)

fade_out.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true" >

    <alpha
        android:duration="1000"
        android:fromAlpha="1.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toAlpha="0.0" />

</set>

La animación de desvanecimiento en Android es exactamente lo opuesto a la animación de desvanecimiento, donde necesitamos disminuir el valor de alpha de 1 a 0.

Animación de Desvanecimiento Cruzado

El desvanecimiento cruzado realiza una animación de desvanecimiento en un TextView mientras otro TextView se desvanece. Esto se puede hacer utilizando los archivos fade_in.xml y fade_out.xml en los dos TextViews. El código se discutirá en el archivo MainActivity.java

Animación de Parpadeo

parpadeo.xml

<set xmlns:android="https://schemas.android.com/apk/res/android">
    <alpha android:fromAlpha="0.0"
        android:toAlpha="1.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:duration="600"
        android:repeatMode="reverse"
        android:repeatCount="infinite"/>
</set>

Aquí, el desvanecimiento y la aparición se realizan infinitamente en modo inverso cada vez.

Animación de Acercamiento

acercamiento.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true" >

    <scale
        xmlns:android="https://schemas.android.com/apk/res/android"
        android:duration="1000"
        android:fromXScale="1"
        android:fromYScale="1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="3"
        android:toYScale="3" >
    </scale>

</set>

Utilizamos pivotX="50%" y pivotY="50%" para realizar el acercamiento desde el centro del elemento.

Animación de Alejamiento

alejamiento.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true" >

    <scale
        xmlns:android="https://schemas.android.com/apk/res/android"
        android:duration="1000"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0.5"
        android:toYScale="0.5" >
    </scale>

</set>

Ten en cuenta que android:from y android:to son opuestos en zoom_in.xml y zoom_out.xml.

Animación de Rotación

rotate.xml

<set xmlns:android="https://schemas.android.com/apk/res/android">
    <rotate android:fromDegrees="0"
        android:toDegrees="360"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="600"
        android:repeatMode="restart"
        android:repeatCount="infinite"
        android:interpolator="@android:anim/cycle_interpolator"/>

</set>

A from/toDegrees tag is used here to specify the degrees and a cyclic interpolator is used.

Animación de Movimiento

move.xml

<set
    xmlns:android="https://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/linear_interpolator"
    android:fillAfter="true">

   <translate
        android:fromXDelta="0%p"
        android:toXDelta="75%p"
        android:duration="800" />
</set>

Animación de Deslizamiento hacia Arriba

slide_up.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true" >

    <scale
        android:duration="500"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:interpolator="@android:anim/linear_interpolator"
        android:toXScale="1.0"
        android:toYScale="0.0" />

</set>

Se logra configurando android:fromYScale=”1.0″ y android:toYScale=”0.0″ dentro de la etiqueta scale.

Animación de Deslizamiento hacia Abajo

slide_down.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true">

    <scale
        android:duration="500"
        android:fromXScale="1.0"
        android:fromYScale="0.0"
        android:toXScale="1.0"
        android:toYScale="1.0" />

</set>

Esto es justo lo opuesto a slide_up.xml.

Animación de rebote

rebote.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true"
    android:interpolator="@android:anim/bounce_interpolator">

    <scale
        android:duration="500"
        android:fromXScale="1.0"
        android:fromYScale="0.0"
        android:toXScale="1.0"
        android:toYScale="1.0" />

</set>

Aquí se utiliza un interpolador de rebote para completar la animación de forma rebote.

Animación secuencial

secuencial.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true"
    android:interpolator="@android:anim/linear_interpolator" >

  
    <!-- Move -->
    <translate
        android:duration="800"
        android:fillAfter="true"
        android:fromXDelta="0%p"
        android:startOffset="300"
        android:toXDelta="75%p" />
    <translate
        android:duration="800"
        android:fillAfter="true"
        android:fromYDelta="0%p"
        android:startOffset="1100"
        android:toYDelta="70%p" />
    <translate
        android:duration="800"
        android:fillAfter="true"
        android:fromXDelta="0%p"
        android:startOffset="1900"
        android:toXDelta="-75%p" />
    <translate
        android:duration="800"
        android:fillAfter="true"
        android:fromYDelta="0%p"
        android:startOffset="2700"
        android:toYDelta="-70%p" />

    <!-- Rotate 360 degrees -->
    <rotate
        android:duration="1000"
        android:fromDegrees="0"
        android:interpolator="@android:anim/cycle_interpolator"
        android:pivotX="50%"
        android:pivotY="50%"
        android:startOffset="3800"
        android:repeatCount="infinite"
        android:repeatMode="restart"
        android:toDegrees="360" />

</set>

Aquí se utiliza un android:startOffset diferente de las transiciones para mantenerlas secuenciales.

Animación conjunta

juntas.xml

<set xmlns:android="https://schemas.android.com/apk/res/android"
    android:fillAfter="true"
    android:interpolator="@android:anim/linear_interpolator" >

    
    <!-- Move -->
    <scale
        xmlns:android="https://schemas.android.com/apk/res/android"
        android:duration="4000"
        android:fromXScale="1"
        android:fromYScale="1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="4"
        android:toYScale="4" >
    </scale>

    <!-- Rotate 180 degrees -->
    <rotate
        android:duration="500"
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="infinite"
        android:repeatMode="restart"
        android:toDegrees="360" />

</set>

Aquí se elimina android:startOffset para que ocurran simultáneamente.

Código

El diseño activity_main.xml consta de un ScrollView y un RelativeLayout (lo discutiremos en un tutorial posterior) en el que se invoca cada tipo de animación en el texto usando sus respectivos botones. El archivo xml se muestra a continuación: activity_main.xml

<ScrollView xmlns:android="https://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <Button
                android:id="@+id/btnFadeIn"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:text="Fade In" />

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:text="Fade In"
                android:id="@+id/txt_fade_in"
            android:layout_alignBottom="@+id/btnFadeIn"
            android:layout_alignLeft="@+id/txt_fade_out"
            android:layout_alignStart="@+id/txt_fade_out" />


        <Button
                android:id="@+id/btnFadeOut"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnFadeIn"
                android:text="Fade Out" />


        <Button
                android:id="@+id/btnCrossFade"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnFadeOut"
                android:text="Cross Fade" />

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:text="Cross Fade In"
                android:id="@+id/txt_out"
                android:visibility="gone"
                android:layout_gravity="center_horizontal"
                android:layout_alignTop="@+id/txt_in"
                android:layout_alignLeft="@+id/txt_in"
                android:layout_alignStart="@+id/txt_in" />

        <Button
                android:id="@+id/btnBlink"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnCrossFade"
                android:text="Blink" />

        <Button
                android:id="@+id/btnZoomIn"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnBlink"
                android:text="Zoom In" />

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:text="Blink"
                android:id="@+id/txt_blink"
                android:layout_gravity="center_horizontal"
            android:layout_alignBottom="@+id/btnBlink"
            android:layout_alignLeft="@+id/txt_zoom_in"
            android:layout_alignStart="@+id/txt_zoom_in" />

        <Button
                android:id="@+id/btnZoomOut"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnZoomIn"
                android:text="Zoom Out" />

        <Button
                android:id="@+id/btnRotate"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnZoomOut"
                android:text="Rotate" />

        <Button
                android:id="@+id/btnMove"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnRotate"
                android:text="Move" />

        <Button
                android:id="@+id/btnSlideUp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnMove"
                android:text="Slide Up" />

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:text="Fade Out"
                android:id="@+id/txt_fade_out"
                android:layout_gravity="center_horizontal"
            android:layout_alignBottom="@+id/btnFadeOut"
            android:layout_alignLeft="@+id/txt_in"
            android:layout_alignStart="@+id/txt_in" />

        <Button
                android:id="@+id/btnSlideDown"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnSlideUp"
                android:text="Slide Down" />

        <Button
                android:id="@+id/btnBounce"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnSlideDown"
                android:text="Bounce" />

        <Button
                android:id="@+id/btnSequential"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="5dp"
                android:layout_below="@id/btnBounce"
                android:text="Sequential Animation" />

        <Button
                android:id="@+id/btnTogether"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/btnSequential"
                android:layout_margin="5dp"
                android:text="Together Animation" />

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:text="Cross Fade Out"
                android:id="@+id/txt_in"
                android:layout_gravity="center_horizontal"
            android:layout_alignBottom="@+id/btnCrossFade"
            android:layout_alignLeft="@+id/txt_blink"
            android:layout_alignStart="@+id/txt_blink" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Zoom In"
            android:id="@+id/txt_zoom_in"
            android:layout_alignBottom="@+id/btnZoomIn"
            android:layout_alignLeft="@+id/txt_zoom_out"
            android:layout_alignStart="@+id/txt_zoom_out" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Zoom Out"
            android:id="@+id/txt_zoom_out"
            android:layout_alignBottom="@+id/btnZoomOut"
            android:layout_toRightOf="@+id/btnSequential"
            android:layout_toEndOf="@+id/btnSequential" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Rotate"
            android:id="@+id/txt_rotate"
            android:layout_above="@+id/btnMove"
            android:layout_toRightOf="@+id/btnSequential"
            android:layout_toEndOf="@+id/btnSequential" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Move"
            android:id="@+id/txt_move"
            android:layout_alignBottom="@+id/btnMove"
            android:layout_alignLeft="@+id/txt_slide_up"
            android:layout_alignStart="@+id/txt_slide_up" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Slide Up"
            android:id="@+id/txt_slide_up"
            android:layout_alignBottom="@+id/btnSlideUp"
            android:layout_toRightOf="@+id/btnSequential"
            android:layout_toEndOf="@+id/btnSequential" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Slide Down"
            android:id="@+id/txt_slide_down"
            android:layout_alignBottom="@+id/btnSlideDown"
            android:layout_alignLeft="@+id/txt_slide_up"
            android:layout_alignStart="@+id/txt_slide_up" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Bounce"
            android:id="@+id/txt_bounce"
            android:layout_alignBottom="@+id/btnBounce"
            android:layout_alignLeft="@+id/txt_slide_down"
            android:layout_alignStart="@+id/txt_slide_down" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Sequential"
            android:id="@+id/txt_seq"
            android:layout_alignBottom="@+id/btnSequential"
            android:layout_alignLeft="@+id/txt_bounce"
            android:layout_alignStart="@+id/txt_bounce" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Together"
            android:id="@+id/txt_tog"
            android:layout_alignBottom="@+id/btnTogether"
            android:layout_toRightOf="@+id/btnSequential"
            android:layout_toEndOf="@+id/btnSequential" />

    </RelativeLayout>

</ScrollView>

Para resumir, un RelativeLayout, como su nombre indica, la disposición de los componentes de la interfaz de usuario es relativa entre sí. El archivo MainActivity.java contiene los listeners onClick para cada botón relacionado con su tipo de animación. A continuación, se muestra el código fuente.

package com.journaldev.animations;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends Activity {

    Button btnFadeIn, btnFadeOut, btnCrossFade, btnBlink, btnZoomIn,
            btnZoomOut, btnRotate, btnMove, btnSlideUp, btnSlideDown,
            btnBounce, btnSequential, btnTogether;
    Animation animFadeIn,animFadeOut,animBlink,animZoomIn,animZoomOut,animRotate
            ,animMove,animSlideUp,animSlideDown,animBounce,animSequential,animTogether,animCrossFadeIn,animCrossFadeOut;
    TextView txtFadeIn,txtFadeOut,txtBlink,txtZoomIn,txtZoomOut,txtRotate,txtMove,txtSlideUp,
                txtSlideDown,txtBounce,txtSeq,txtTog,txtIn,txtOut;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        btnFadeIn = (Button) findViewById(R.id.btnFadeIn);
        btnFadeOut = (Button) findViewById(R.id.btnFadeOut);
        btnCrossFade = (Button) findViewById(R.id.btnCrossFade);
        btnBlink = (Button) findViewById(R.id.btnBlink);
        btnZoomIn = (Button) findViewById(R.id.btnZoomIn);
        btnZoomOut = (Button) findViewById(R.id.btnZoomOut);
        btnRotate = (Button) findViewById(R.id.btnRotate);
        btnMove = (Button) findViewById(R.id.btnMove);
        btnSlideUp = (Button) findViewById(R.id.btnSlideUp);
        btnSlideDown = (Button) findViewById(R.id.btnSlideDown);
        btnBounce = (Button) findViewById(R.id.btnBounce);
        btnSequential = (Button) findViewById(R.id.btnSequential);
        btnTogether = (Button) findViewById(R.id.btnTogether);
        txtFadeIn=(TextView)findViewById(R.id.txt_fade_in);
        txtFadeOut=(TextView)findViewById(R.id.txt_fade_out);
        txtBlink=(TextView)findViewById(R.id.txt_blink);
        txtZoomIn=(TextView)findViewById(R.id.txt_zoom_in);
        txtZoomOut=(TextView)findViewById(R.id.txt_zoom_out);
        txtRotate=(TextView)findViewById(R.id.txt_rotate);
        txtMove=(TextView)findViewById(R.id.txt_move);
        txtSlideUp=(TextView)findViewById(R.id.txt_slide_up);
        txtSlideDown=(TextView)findViewById(R.id.txt_slide_down);
        txtBounce=(TextView)findViewById(R.id.txt_bounce);
        txtSeq=(TextView)findViewById(R.id.txt_seq);
        txtTog=(TextView)findViewById(R.id.txt_tog);
        txtIn=(TextView)findViewById(R.id.txt_in);
        txtOut=(TextView)findViewById(R.id.txt_out);
        animFadeIn = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.fade_in);
		
        animFadeIn = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.fade_in);
        // aparecer
        btnFadeIn.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                txtFadeIn.setVisibility(View.VISIBLE);
                txtFadeIn.startAnimation(animFadeIn);
            }
        });

        animFadeOut = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.fade_out);

        // desaparecer
        btnFadeOut.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtFadeOut.setVisibility(View.VISIBLE);
                txtFadeOut.startAnimation(animFadeOut);
            }
        });
        animCrossFadeIn = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.fade_in);
        animCrossFadeOut = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.fade_out);
        // fundido cruzado
        btnCrossFade.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtOut.setVisibility(View.VISIBLE);
                // iniciar animación de aparición
                txtOut.startAnimation(animCrossFadeIn);

                // iniciar animación de desaparición
                txtIn.startAnimation(animCrossFadeOut);
            }
        });
        animBlink = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.blink);
        // parpadear
        btnBlink.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtBlink.setVisibility(View.VISIBLE);
                txtBlink.startAnimation(animBlink);
            }
        });

        animZoomIn = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.zoom_in);
        // hacer zoom in
        btnZoomIn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtZoomIn.setVisibility(View.VISIBLE);
                txtZoomIn.startAnimation(animZoomIn);
            }
        });
        animZoomOut = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.zoom_out);
        // hacer zoom out
        btnZoomOut.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtZoomOut.setVisibility(View.VISIBLE);
                txtZoomOut.startAnimation(animZoomOut);
            }
        });
        animRotate = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.rotate);

        // Rotate
        btnRotate.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtRotate.startAnimation(animRotate);
            }
        });
        animMove = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.move);
        // Move
        btnMove.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtMove.startAnimation(animMove);
            }
        });
        animSlideUp = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.slide_up);
        // deslizar hacia arriba
        btnSlideUp.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtSlideUp.startAnimation(animSlideUp);
            }
        });
        animSlideDown = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.slide_down);
        // deslizar hacia abajo
        btnSlideDown.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtSlideDown.startAnimation(animSlideDown);
            }
        });
        animBounce = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.bounce);
        // deslizar hacia abajo
        btnBounce.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtBounce.startAnimation(animBounce);
            }
        });
        animSequential = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.sequential);
        // Sequential
        btnSequential.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                        txtSeq.startAnimation(animSequential);
            }
        });
        animTogether = AnimationUtils.loadAnimation(getApplicationContext(),
                R.anim.together);

        // Together
        btnTogether.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                txtTog.startAnimation(animTogether);
            }
        });

    }
}

Como se discutió anteriormente, cada animación de textView se inicia invocando el objeto de animación respectivo en el cual la lógica de animación se carga mediante el método AnimationUtils.loadAnimation(). La animación de fundido cruzado consta de dos TextView en los cuales uno se desvanece y el otro aparece. A continuación, se muestra un breve video que muestra todas las animaciones en nuestra aplicación. La animación juntas se ve en la imagen anterior. Tenga en cuenta que estas animaciones, cuando se ejecutan en un emulador, pueden no ser suaves, por lo que se recomienda ejecutar la aplicación en un dispositivo normal. Esto concluye el tutorial de ejemplo de animación en Android. Puede descargar el Proyecto de Ejemplo de Animación en Android desde el siguiente enlace.

Descargar Proyecto XML de Animación en Android