How to Scale and Rotate Image in Android

Introduction

This article explains how to scale and rotate images in Android.

In this application when you click on the button the image will both rotate and scale. So use an Image View and a button in the XML file. So you need to perform both rotations and scaling on a button click. First, create a folder inside the res folder and put the following in it:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:interpolator="@android:anim/linear_interpolator" >
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="4000"
android:fromXScale="1"
android:fromYScale="1"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="4"
android:toYScale="4" >
</scale>
<rotate
android:duration="500"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="10"
/>
</set>

<Set>
It is a container to hold the animation element (<sclae>, <rotate> and so on).
<scale>
Represents the scale of an animation object.
android:duration
It is an attribute to do the animation for a specified time.
android:fromXScale
The starting X size offset where 1.0 is no change.
android:fromYScale
The starting Y size offset where 1.0 is no change.
android:pivotX
The x coordinate remains fixed when the object is scaled.
android:pivotY
The Y coordinate remains fixed when the object is scaled,
<rotate>
It represents the rotation of an animation.
android:formDegrees
From which degrees you want to rotate your object.
androdi:toDegrees
To which degrees you want to rotate your object.

In your Java file, you need to load this XML file by ing the path of this file. First, you will create an Animation reference variable and this animation object will hold the animation object that is returned by the loadAniamtion() method. Then you will call the setAnimationListener() method to set the animation. Because you need to perform all the operations on the button click so set the button on its clickListener and start the animation of the image.

Togetheraniamtion = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.together);
// set animation listener
Togetheraniamtion.setAnimationListener(this);
// button click event
rotatescale.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// start the animation
imageview.startAnimation(Togetheraniamtion);
}
});
}

Step 1

Create an XML file and write this

Use an Image View and button in an XML file to do both rotation and scaling on button click.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:id="@+id/imageview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher"
android:layout_centerInParent="true"/>
<Button android:id="@+id/btnStart"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:text="RotateScale"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"/>
</RelativeLayout>

Step 2

In the together.xml file inside the animk folder, you will write the following.

Create a folder inside the res folder and write this:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:interpolator="@android:anim/linear_interpolator" >
<scale
xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="4000"
android:fromXScale="1"
android:fromYScale="1"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="4"
android:toYScale="4" >
</scale>
<rotate
android:duration="500"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="infinite"
/>
</set>

Step 3

Create a Java file and write the following.

In your Java file, you need to load this XML file by ing the path of this file. First, you will create an Animation reference variable and this animation object will hold the animation object returned by the loadAniamtion() method. Then call the setAnimationListener() method to set the animation, because you need to perform all operations on a button click so set the button on its clickListener and start the animation on the image.

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.Animation.AnimationListener;
import android.widget.Button;
import android.widget.ImageView;
public class TogetherActivity extends Activity implements AnimationListener {
ImageView imageview;
Button rotatescale;
// Animation
Animation Togetheraniamtion;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_together);
imageview = (ImageView) findViewById(R.id.imgLogo);
rotatescale = (Button) findViewById(R.id.btnStart);
// load the animation
Togetheraniamtion = AnimationUtils.loadAnimation(getApplicationContext(),
R.anim.together);
// set animation listener
Togetheraniamtion.setAnimationListener(this);
// button click event
rotatescale.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// start the animation
imageview.startAnimation(Togetheraniamtion);
}
});
}
@Override
public void onAnimationEnd(Animation animation) {
// Take any action after completing the animation
// check for zoom in animation
if (animation ==Togetheraniamtion) {
}
}
@Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
@Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}

Step 4

Output

Step 5

Step 6

It will rotate continuously unless you do not change the android:repeatcount to infinite.