Animaciones

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.

Ejercicio: Al pulsar sobre un botón, convertir una imagen en otra

Asignaremos el xml de la animación al imageview usando el atributo src del layout.

MainActivity.java
ImageView iv = findViewById(R.id.imageView1);
TransitionDrawable td = (TransitionDrawable) iv.getDrawable();
td.startTransition(1000);
res/drawable/transition.xml
<?xml version="1.0" encoding="utf-8"?>
<transition
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/steve1"></item>
    <item android:drawable="@drawable/steve2"></item>
</transition>

En el layout, el ImageView deberá tener el siguiente atributo: android:src=»@drawable/transition»

Ejercicio

Al pulsar sobre un botón, animarlo utilizando la clase Tween, que se encargará de deformarlo.

MainActivity.java
…
Animation anim = AnimationUtils.loadAnimation(this, R.anim.animation);
Button b = findViewById(R.id.button1);
b.startAnimation(anim);

// iv.reverseTransition(1000); // hace la animación en dirección contraria
…
res/anim/animation.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:fromXScale="0.5"
        android:toXScale="2.0"
        android:fromYScale="0.5"
        android:toYScale="2.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="4000"
        >
    </scale>
</set>

Ejercicio: set de animaciones

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
	<scale xmlns:android="http://schemas.android.com/apk/res/android"
	 	android:fromXScale="0.5"
	 	android:toXScale="2.0"
	 	android:fromYScale="0.5"
	 	android:toYScale="2.0"
	 	android:pivotX="50%"
	 	android:pivotY="50%"
	 	android:duration="4000" />
	<rotate android:fromDegrees="0"
		android:toDegrees="180"
		android:pivotX="50%"
		android:pivotY="50%"
		android:duration="20000"
		android:startOffset="2000" />
</set>

Detectar el fin de una animación

El activity debe implementar la interfaz AnimationListener.

...
questionsPanel_anim.setAnimationListener(this);
questionsPanel.startAnimation(questionsPanel_anim);	
...


public void onAnimationEnd(Animation arg0) {
		if(arg0==questionsPanel_anim){
			pintarPreguntasYRespuestas();
		}
}

Animación FrameByFrame

MainActivity.java
…
ImageView iv = findViewById(R.id.imageView1);
iv.setBackgrounResource(R.drawable.animation);
AnimationDrawable animation = (AnimationDrawable) iv.getBackground();
animation.start();
res/drawable/animation.xml
<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/animation_00031" android:duration="30" />
<item android:drawable="@drawable/animation_00032" android:duration="30" />
<item android:drawable="@drawable/animation_00033" android:duration="30" />
…
res/layout/activity_main.xml
<ImageView
    android:background="@drawable/animation"
    ...
/>
Descargar Recurso

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.