Animations in Android- Sinking/ Sliding/ Rotation/ Zoom in

Animations are easy in Android:

         Sometime, you are asked to program some animations for an application. Initially, i always tries my best to get hide from such tasks but time makes me good in it. Here, i'm sharing a work of days with you, i hope new comers and others will like it.

     So, we are going to start from Basics.

    1.  Open Eclipse and create a folder anim in the res folder.

    2.  Now create a file test_anim.xml inside the anim folder and write following lines.

<?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:duration="250"
        android:fromYDelta="0%"
        android:toYDelta="7%" />

    <scale
        android:duration="250"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="0%"
        android:pivotY="0%"
        android:startOffset="100"
        android:toXScale="0.96"
        android:toYScale="0.96" >
    </scale>

</set>

           The Values of the %age are related to the parent whereas the interpolator plays it's role to indicate how the animation will proceed by defining the rate of change of an animation as well as allows the  basic animation effects like alpha, scale, translate, rotate to be accelerated, decelerated, repeated, etc.
    3.  Layout file will be the kept as default or add any other widgets as i have 2 buttons.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/linear_layout"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent" >

    <Button
        android:id="@+id/button1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button 1" />
    
    <Button
        android:id="@+id/button2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button 2" />

</LinearLayout>

     4. Now, it's a time to play some animation work in the .java file

package scube.rao.androidblog;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.LinearLayout;

public class MainActivity extends Activity implements AnimationListener, OnClickListener {

 Button btn;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        btn= (Button) findViewById(R.id.button1);
        btn.setOnClickListener(this);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.activity_main, menu);
        return true;
    }

 public void onAnimationEnd(Animation animation) {
  // TODO Auto-generated method stub
  
 }

 public void onAnimationRepeat(Animation animation) {
  // TODO Auto-generated method stub
  
 }

 public void onAnimationStart(Animation animation) {
  // TODO Auto-generated method stub
  
 }

 public void onClick(View v) {
  // TODO Auto-generated method stub
        LinearLayout linear_Layout = (LinearLayout) findViewById(R.id.linear_layout);

        Animation animation = AnimationUtils.loadAnimation(this,R.anim.test_anim);
        animation.setAnimationListener(this);
        linear_Layout.clearAnimation();
        linear_Layout.startAnimation(animation);
 }
}

Here, in OnClick method for button 1 from layout file. i am using AnimationUtils to load the animation from anim folder and creating a instance of linear layout of xml file. and applying the current animation. Above animation will zoom out the layout from the xml file.

Other anims files.

Rotating at 180 degree

Some code here

Other anims files.

Rotating at 180 degree

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator" >

    <rotate
        android:duration="600"
        android:fromDegrees="180"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="0" >
    </rotate>

</set>

Sliding from Down:

<?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:duration="700"
        android:fromYDelta="70%"
        android:toYDelta="0%" >
    </translate>

</set>

Sliding from Up:

<?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"
        />

</set>

Sliding from Right:

<?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:duration="600"
        android:fromXDelta="100%p"
        android:toXDelta="0%p" >
    </translate>

</set>

Sliding from Left:

<?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:duration="600"
        android:fromXDelta="-100%p"
        android:toXDelta="0%" >
    </translate>

</set>

For more detail check: Android Developer API Guide