Zooming image Animation on ImageView

This post is about zooming the image on the ImageView, which is useful for apps using animations. This can be a good zoom animation to make an image automatically zoom-in and zoom-out without using any touch zoom or pinch zoom.

NOTE :  This project is developed in Android Studio, and tested in Android Marshmallow 6.0 .

Follow the steps below to create an image zoom-in and zoom-out automatically:

  • Create a new project with any minimum SDK of your choice.
  • Copy and paste an image which you want to have on your ImageView in the drawable folder (I named the image anim_zoom.png)

zooming

 

  • Create an ImageView in the activity_main.xml and display the image. See the following code to create the imageview
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.sachin_kumar.animationzoom.MainActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
        android:src="@drawable/anim_zoom"
        android:layout_alignParentTop="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentBottom="true"
        android:layout_alignParentEnd="true" />
</RelativeLayout>

 

  • In res folder, Create New Directory with name anim.

zooming_1

 

  • In anim directory, Create a new XML file with name zoom and add the following code in it.
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
    <scale
        android:duration="3000"
        android:fromXScale="0.2"
        android:fromYScale="0.2"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1.0"
        android:toYScale="1.0"
        android:repeatMode="reverse"
        android:repeatCount="infinite"/>
</set>

 

  • Now, add the final code in your main file i.e MainActivity.java
public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final ImageView zoom = (ImageView) findViewById(R.id.imageView);
        final Animation zoomAnimation = AnimationUtils.loadAnimation(this, R.anim.zoom);
        zoom.startAnimation(zoomAnimation);
    }
}

 

  • Run your app and see the image zooming-in and zooming out indefinitely.

zooming   zooming   zooming

 

5 thoughts on “Zooming image Animation on ImageView

Leave a Reply

Your email address will not be published. Required fields are marked *

sixteen − 6 =