Post
Ask Question

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:
  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <LinearLayout  
  3.         android:orientation="vertical"  
  4.         android:layout_width="fill_parent"  
  5.         android:layout_height="fill_parent"  
  6.         xmlns:android="http://schemas.android.com/apk/res/android"  
  7.         android:background="#80BFFF">  
  8.     
  9.     <ImageView  
  10.             android:layout_width="wrap_content"  
  11.             android:layout_height="wrap_content"  
  12.             android:id="@+id/imageView"  
  13.             android:layout_gravity="center"  
  14.             android:src="@drawable/ic_launcher"/>  
  15.    
  16.     <LinearLayout  
  17.             android:layout_width="wrap_content"  
  18.             android:layout_height="wrap_content"  
  19.             android:layout_marginTop="200dp">  
  20.    
  21.    
  22.         <Button  
  23.                 android:layout_width="80dp"  
  24.                 android:layout_height="40dp"  
  25.                 android:text="Scale"  
  26.                 android:id="@+id/button1"  
  27.    
  28.              />  
  29.    
  30.         <Button  
  31.                 android:layout_width="80dp"  
  32.                 android:layout_height="fill_parent"  
  33.                 android:text="Translate"  
  34.                 android:id="@+id/button2"  
  35.              />  
  36.    
  37.    
  38.         <Button  
  39.                 android:layout_width="80dp"  
  40.                 android:layout_height="40dp"  
  41.                 android:text="Rotate"  
  42.                 android:id="@+id/button3"  
  43.               />  
  44.    
  45.         <Button  
  46.                 android:layout_width="80dp"  
  47.                 android:layout_height="40dp"  
  48.                 android:text="Alpha"  
  49.                 android:id="@+id/button4"  
  50.                />  
  51.    
  52.     </LinearLayout>  
  53.    
  54. </LinearLayout> 
Step 2
 
Create a Java file and write this:
  1. package com.androidanimation;  
  2. import android.content.DialogInterface;  
  3. import android.os.Bundle;  
  4. import android.app.Activity;  
  5. import android.view.Menu;  
  6. import android.view.View;  
  7. import android.view.animation.AlphaAnimation;  
  8. import android.view.animation.RotateAnimation;  
  9. import android.view.animation.ScaleAnimation;  
  10. import android.view.animation.TranslateAnimation;  
  11. import android.widget.Button;  
  12. import android.widget.ImageView;  
  13. public class MainActivity extends Activity implements View.OnClickListener {  
  14.  Button btn1, btn2, btn3, btn4;  
  15.  ImageView img_view;  
  16.  ScaleAnimation scale;  
  17.  TranslateAnimation trans;  
  18.  RotateAnimation rotate;  
  19.  AlphaAnimation alpha;  
  20.  @Override  
  21.  protected void onCreate(Bundle savedInstanceState) {  
  22.   super.onCreate(savedInstanceState);  
  23.   setContentView(R.layout.activity_main);  
  24.   btn1 = (Button) findViewById(R.id.button1);  
  25.   btn2 = (Button) findViewById(R.id.button2);  
  26.   btn3 = (Button) findViewById(R.id.button3);  
  27.   btn4 = (Button) findViewById(R.id.button4);  
  28.   img_view = (ImageView) findViewById(R.id.imageView);  
  29.   btn1.setOnClickListener(this);  
  30.   btn2.setOnClickListener(this);  
  31.   btn3.setOnClickListener(this);  
  32.   btn4.setOnClickListener(this);  
  33.  }  
  34.  @Override  
  35.  public void onClick(View v) {  
  36.   switch (v.getId()) {  
  37.    case R.id.button1:  
  38.     scale = new ScaleAnimation(0, 2, 0, 2);  
  39.     scale.setDuration(500);  
  40.     img_view.startAnimation(scale);  
  41.     break;  
  42.    case R.id.button2:  
  43.     trans = new TranslateAnimation(0, 100, 0, 100);  
  44.     trans.setDuration(500);  
  45.     img_view.startAnimation(trans);  
  46.     break;  
  47.    case R.id.button3:  
  48.     rotate = new RotateAnimation(0, 300);  
  49.     rotate.setDuration(500);  
  50.     img_view.startAnimation(rotate);  
  51.     break;  
  52.    case R.id.button4:  
  53.     alpha = new AlphaAnimation(0, 100);  
  54.     alpha.setDuration(500);  
  55.     img_view.startAnimation(alpha);  
  56.     break;  
  57.   }  
  58.  }  
  59. } 
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


Similar Articles