Android Animation List

                            Android Animation List

Blink

Blink animation is animating fade out or fade in animation in repetitive fashion. For this you will have to set android:repeatMode=”reverse” and android:repeatCount attributes.

blink.xml

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://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>

Zoom In

For zoom use <scale> tag. Use pivotX=”50%” and pivotY=”50%” to perform zoom from the center of the element. Also you need to use fromXScale, fromYScale attributes which defines scaling of the object. Keep these value lesser than toXScale, toYScale

zoom_in.xml

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"     android:fillAfter="true" >       <scale         xmlns:android="http://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>

Zoom Out

Zoom out animation is same as zoom in but toXScale, toYScale values are lesser thanfromXScale, fromYScale

zoom_out.xml

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"     android:fillAfter="true" >       <scale         xmlns:android="http://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>

Rotate

Rotate animation uses <rotate> tag. For rotate animation required tags areandroid:fromDegrees and android:toDegrees which defines rotation angles.

Clock wise – use positive toDegrees value
Anti clock wise – use negative toDegrees value

rotate.xml

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://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>

Move

In order to change position of object use <translate> tag. It uses fromXDelta, fromYDeltafor X-direction and toXDelta, toYDelta attributes for Y-direction.

move.xml

<?xml version="1.0" encoding="utf-8"?> <set     xmlns:android="http://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>

Slide Up

Sliding animation uses <scale> tag only. Slide up can be achieved by settingandroid:fromYScale=”1.0″ and android:toYScale=”0.0″

slide_up.xml

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://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>

Slide Down

Slide down is exactly opposite to slide down animation. Just interchange android:fromYScale andandroid:toYScale values.

slide_down.xml

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

Bounce

Bounce is just an animation effect where animation ends in bouncing fashion. For this setandroid:interpolator value to @android:anim/bounce_interpolator. This bounce can be used with any kind animation. Following slide down example uses bounce effect.

bounce.xml

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://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>

Sequential Animation

If you want to perform multiple animation in a sequential manner you have to useandroid:startOffset to give start delay time. The easy way to calculate this value is to add the duration and startOffset values of previous animation. Following is a sequential animation where set of move animations performs in sequential manner.

sequential.xml

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"     android:fillAfter="true"     android:interpolator="@android:anim/linear_interpolator" >       <!-- Use startOffset to give delay between animations -->         <!-- 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>

Together Animation

Performing all animation together is just writing all animations one by one without usingandroid:startOffset

together.xml

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"     android:fillAfter="true"     android:interpolator="@android:anim/linear_interpolator" >       <scale         xmlns:android="http://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>