Image View Animation in Android Studio

Introduction

In this article you will learn animation using Image View in Android Studio.

Animation

Animation is anything that moves on your screen like a cartoon character.

In this article you will use Scale Animation which is a sub class of animation that controls the scale of an object. In this you will create an object of scale animation and that object to the startAnimation() method.

Translate animation is a subclass of Animation that controls the position of an object. In this you will create the object of  translate animation and that object to the startAnimation() method.

Rotate animation is a subclass of Animation that controls the rotation of an object. In this you will create the object of  rotate animation and that object to the  startAnimation() method.

is a subclass of Animation that controls the alpha level of an object. It is used to fade things in and out. In this you will create the object of  alpha animation and that object to the  startAnimation() method.

Step 1

Create an XML file and write this:

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

<LinearLayout

        android:orientation="vertical"

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

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

        android:background="#80BFFF">

  

    <ImageView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:id="@+id/imageView"

            android:layout_gravity="center"

            android:src="@drawable/ic_launcher"/>

 

    <LinearLayout

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginTop="200dp">

 


        <Button

                android:layout_width="80dp"

                android:layout_height="40dp"

                android:text="Scale"

                android:id="@+id/button1"

 

             />

 

        <Button

                android:layout_width="80dp"

                android:layout_height="fill_parent"

                android:text="Translate"

                android:id="@+id/button2"

             />

 

 

        <Button

                android:layout_width="80dp"

                android:layout_height="40dp"

                android:text="Rotate"

                android:id="@+id/button3"

              />

 

        <Button

                android:layout_width="80dp"

                android:layout_height="40dp"

                android:text="Alpha"

                android:id="@+id/button4"

               />


    </LinearLayout>

 

 

 

</LinearLayout>

Step 2

Create a Java file and write this:

package com.androidanimation;

 

import android.content.DialogInterface;

import android.os.Bundle;

import android.app.Activity;

import android.view.Menu;

import android.view.View;

import android.view.animation.AlphaAnimation;

import android.view.animation.RotateAnimation;

import android.view.animation.ScaleAnimation;

import android.view.animation.TranslateAnimation;

import android.widget.Button;

import android.widget.ImageView;

 

public class MainActivity extends Activity implements View.OnClickListener {

 

   Button btn1,btn2,btn3,btn4;

    ImageView img_view;

    ScaleAnimation scale;

    TranslateAnimation trans;

    RotateAnimation rotate;

    AlphaAnimation alpha;

 

 

 

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

 

        btn1=(Button)findViewById(R.id.button1);

        btn2=(Button)findViewById(R.id.button2);

        btn3=(Button)findViewById(R.id.button3);

        btn4=(Button)findViewById(R.id.button4);

        img_view=(ImageView)findViewById(R.id.imageView);

 

        btn1.setOnClickListener(this);

        btn2.setOnClickListener(this);

        btn3.setOnClickListener(this);

        btn4.setOnClickListener(this);

 

    }

        @Override

        public void onClick(View v) {

 

            switch(v.getId()){

            case R.id.button1:

                scale=new ScaleAnimation( 0 ,2 ,0 ,2);

                scale.setDuration(500);

                img_view.startAnimation(scale);

                break;

 

                case R.id.button2:

                    trans=new TranslateAnimation(0 ,100 ,0 , 100);

                    trans.setDuration(500);

                    img_view.startAnimation(trans);

                         break;

 

                case R.id.button3:

                            rotate=new RotateAnimation(0 ,300);

                        rotate.setDuration(500);

                        img_view.startAnimation(rotate);

                             break;

 

 

                case R.id.button4:

                    alpha=new AlphaAnimation(0 ,100);

                    alpha.setDuration(500);

                    img_view.startAnimation(alpha);

                  break;

 

}

        }

 

}

 

Step 3

Output screen:

6.jpg


Step 4

When you click on the scale button:

3.jpg

Step 5

When you click on the rotate button:

4.jpg

Step 6


When you click on the Translate button:

5.jpg



Step 7

When you click on the alpha button:

8.jpg

 

Up Next
    Ebook Download
    View all
    Learn
    View all