Programacin

Android
Rafael Morn Abad rafaelmoron@gmail.com

Alterna7vas para animaciones

Android soporta animaciones de dos formas dis7ntas: ViewAnima7on
Dene transformaciones o secuencias de imgenes sobre cualquier Vista

PropertyAnima7on
Es el mecanismo ms potente ya que permite cambiar cualquier propiedad de cualquier objeto a lo largo del 7empo Slo est disponible desde Android 3.0, por lo que actualmente slo podremos usarlo en tabletas.

ViewAnima7on
A su vez, ViewAnima7on ofrece dos es7los de animaciones. TweenAnima)on
Dene transformaciones sobre cualquier Vista. Podemos cambiar su posicin, tamao, rotacin y nivel de transparencia

FrameAnima)on
Se trata de una secuencia de imgenes, de forma que cada una estar en pantalla el 7empo que le indiquemos. Se asemeja a un GIF animado.

TweenAnima7on
Se codica mediante un chero XML que con7ene uno de estos elementos: <alpha/> <scale/> <translate/> <rotate/> <set/> Nivel de transparencia Cambio de tamao Traslacin Rotacin Grupo de las anteriores

Slo puede haber un elemento raz.

TweenAnima7on - <set/>
<set/>
Con7ene elementos <alpha/>, <scale>, <translate>, <rotate>) o otros <set/>. Representa un Anima7onSet.

A:ributos: android:interpolator
Recurso interpolador que se u7lizar para calcular los estados intermedios que se mostrarn. Hay varios predenidos.

android:shareInterpolator
Booleano. "true" si se quiere que todos los nodos hijo tengan el mismo interpolador.

TweenAnima7on - <alpha/>
<alpha/> Cambia el valor de transparencia. Representa una AlphaAnima7on. A:ributos: android:fromAlpha
Float. Opacidad inicial (0.0 es transparente, 1.0 es opaco)

android:toAlpha
Float. Opacidad nal (0.0 es transparente, 1.0 es opaco)

TweenAnima7on - <scale/>
<scale/> Cambia el tamao. A:ributos:
android:fromXScale android:toYScale Float. Escala inicial en X Float. Escala nal en Y android:toXScale android:pivotX Float. Escala nal en X Float. X del punto central android:fromYScale android:pivotY Float. Escala inicial en Y Float. Y del punto central

TweenAnima7on - <translate/>
<translate/> Efecta una traslacin. Representa a TranslateAnima7on. A:ributos: Se indican como una diferencia respecto de su posicin normal. Pueden ir en pxeles (5) o en %, bien respecto de su ancho (5%) o del del padre (5%p).

android:fromXDelta android:fromYDelta Float o porcentaje. Var. Float o porcentaje. Var. posicin inicial en X. posicin inicial en Y android:toXDelta android:toYDelta Float o porcentaje. Var. Float o porcentaje. Var. posicin nal en X posicin nal en Y

TweenAnima7on - <rotate/>
<rotate/> Efecta una rotacin. Representa un RotateAnima7on A:ributos pivot: Se indican como una diferencia respecto de su posicin normal. Pueden ir en pxeles (5) o en %, bien respecto de su ancho (5%) o del del padre (5%p).

android:pivotX android:fromDegrees Float o porcentaje. X del Float. Posicin inicial en centro de giro. grados. android:pivotY android:toDegrees Float o porcentaje. Y del Float. Posicin nal en centro de giro. grados.

Ejemplo TweenAnima7on
<set xmlns:android="http:// schemas.android.com/apk/res/android"! 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/ accelerate_interpolator"! android:startOffset="700">! <scale! android:fromXScale="1.4"! android:toXScale="0.0"! android:fromYScale="0.6"! android:toYScale="0.0"! android:pivotX="50%"! android:pivotY="50%"! android:duration="400" />! <rotate! android:fromDegrees="0"! android:toDegrees="-45"! android:toYScale="0.0"! android:pivotX="50%"! android:pivotY="50%"! android:duration="400" />! </set>! </set>!

Fuente: hhp://developer.android.com/guide/topics/resources/anima7on-resource.html

Ejemplo TweenAnima7on (II)

Cdigo para u7lizarla:
ImageView image = (ImageView) findViewById(R.id.image);! Animation hyperspaceJump = AnimationUtils. loadAnimation(this, R.anim.hyperspace_jump);! image.startAnimation(hyperspaceJump);!

Fuente: hhp://developer.android.com/guide/topics/resources/anima7on-resource.html

FrameAnima7on
Se trata de una secuencia de imgenes en un orden, como un GIF animado. <anima)on-list/> Elemento raz <item/> Cada una de las imgenes o marcos Slo puede haber un elemento raz.

FrameAnima7on - <anima7on-list/>
<anima)on-list/> Elemento raz de una FrameAnima7on. A:ributos: android:oneshot Booleano. true si se mostrar una vez, false si se mostrar en bucle

FrameAnima7on - <item/>
<item/> Cada marco o imagen de la animacin. A:ributos: android:drawable Objeto Drawable. El recurso a u7lizar. android:dura)on Integer. La duracin, en milisegundos, de ese marco.

Interpoladores
Los interpoladores denen la forma en que se calcula cada secuencia intermedia en una animacin. Se asocian a una animacin a travs del elemento android:interpolator. Heredan de la clase Interpolator. Se pueden denir interpoladores a medida, pero Android 7ene muchos predenidos.

Interpoladores (II)
Clase del Interpolador AccelerateDecelerateInterpolator AccelerateInterpolator An7cipateInterpolator An7cipateOvershootInterpolator BounceInterpolator CycleInterpolator DecelerateInterpolator LinearInterpolator OvershootInterpolator ID de recurso @android:anim/accelerate_decelerate_interpolator @android:anim/accelerate_interpolator @android:anim/an7cipate_interpolator @android:anim/an7cipate_overshoot_interpolator @android:anim/bounce_interpolator @android:anim/cycle_interpolator @android:anim/decelerate_interpolator @android:anim/linear_interpolator @android:anim/overshoot_interpolator

Ejemplo FrameAnima7on
res/anim/rocket.xml! ! <?xml version="1.0" encoding="utf-8"?>! <animation-list xmlns:android="http://schemas.android.com/apk/res/ android"! android:oneshot="false">! <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />! <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />! <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />! </animation-list>!

Fuente: hhp://developer.android.com/guide/topics/resources/anima7on-resource.html

Ejemplo FrameAnima7on (II)

Cdigo para u7lizarla:
!

ImageView rocketImage = ! !(ImageView) findViewById(R.id.rocket_image);! rocketImage.! !setBackgroundResource(R.drawable.rocket_thrust);! rocketAnimation = (AnimationDrawable) !rocketImage.getBackground();! rocketAnimation.start();!

Fuente: hhp://developer.android.com/guide/topics/resources/anima7on-resource.html

Ejemplo Prc7co: TweenAnima7on

TweenAnima7on
Realizar una aplicacin para Android 2.2 que gire un texto al pulsar la pantalla.