World of animations in Android

Setting animations to a layout , programmatically is described as below. Its a good practice to clear any previously set animations prior to set new animation. Here we go:

Create an xml file (say “bottom_out.xml”) and place it inside a folder called “anim” down the “res” folder. Content of the bottom_out.xml file goes like below..

<?xml version="1.0" encoding="utf-8"?>

<set

     xmlns:android="http://schemas.android.com/apk/res/android"

     android:interpolator="@android:anim/accelerate_interpolator">

     <translate

           android:fromYDelta="0%"

           android:toYDelta="60%"

           android:duration="700">

     </translate>

</set>

In place of “%”  you can use “%p”  indicating so many percent of its parent layout. Interpolator is to indicate how animation should proceed- say, it should be accelerated during end. Another interpolator is “linear_interpolator”.

myLayout (pointing to R.id.anim_layout) is a simple LinearLayout defined in xml file under “layout” folder. The necessary java code snippet goes down:

private void startAnimationPopOut()

{         

      LinearLayout myLayout =(LinearLayout)findViewById(R.id.anim_layout);

            

      Animation animation =AnimationUtils.loadAnimation(this,R.anim.bottom_out);

       animation.setAnimationListener(new AnimationListener()

       {                  

           @Override

           public void onAnimationStart(Animation animation) {

                               

           }

                    

           @Override

           public void onAnimationRepeat(Animation animation) {

          

           }

          

           @Override

public void onAnimationEnd(Animation animation) {

                          

           }

     });

            

     myLayout.clearAnimation();

     myLayout.startAnimation(animation);

          

}

Below are some of the samples I would like to share:

Sinking in:

<translate

     android:fromYDelta="70%"

     android:toYDelta="0%"

     android:duration="700">

</translate>

Slide from left side:

< translate

     android:fromXDelta="-100%p"

     android:toXDelta="0%"

     android:duration="600">

</ translate >

Slide from right side:

< translate

     android:fromXDelta="100%p"

     android:toXDelta="0%p"

     android:duration="600">

</ translate >

Rotate from 0 to 180 degree:

<rotate  

    android:fromDegrees="180"

    android:toDegrees="0"

    android:pivotX="50%"

    android:pivotY="50%"

    android:duration="600">

 </rotate>

Here pivotX and PivotY are the x and y coordinates of center around which you wish the view to rotate.

Scale (here it is zooming in):

<scale                 

    android:toXScale="1.1"               

    android:fromXScale="1.0"             

     

    android:toYScale="1.1"

    android:fromYScale="1.0"

   

    android:pivotX="0%"

    android:pivotY="0%"

   

    android:startOffset="100"

    android:duration="2000">

 </scale>

 <!-- Here 1.0 implies original view size;

as pivot is set 0, view will be scaled taking its origin as center-->

More about Animation is here.

Happy coding:-)