Scribd
Upload
13 views14 pages

LAB 16 ImageAnimation

Uploaded by

mca231419ics
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
13 views14 pages

LAB 16 ImageAnimation

Uploaded by

mca231419ics
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 14

Name: Aman Verma MET – Institute of Computer Science

Roll No: 1266

Image Animation I
AIM: To create an application and apply various animation in an image.
Assignment:
1. Create an application and apply following animation on the image.
a) Zoom the image
b) Rotate the image
c) Fade the image
1) Fade in and Fade out operations
fromAlpha : actual color of the image = 1
toAlpha : transparency level = 0
RepeatMode :
Reverse : both operations fading in and fading out
Restart : will apply only of the either operations (ie fade in or fade out)
RepeatCount : how many times you want to repeat the operation
2) Zoom
from Xcale = 0.2 from YScale = 0.2
to XScale = 5.0 to YScale = 5.0

3) Rotate
1) clockwise direction 0 to 360
2) anticlockwise direction 360 to 0
fromdegree = 360
todegree = 0

CODE:
activityMain.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

tools:context=".MainActivity">

<ImageView
android:layout_width="match_parent"
android:layout_height="420dp"
android:layout_margin="20dp"
android:src="@drawable/dvk"
android:id="@+id/img1">

</ImageView>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/btn1"
android:layout_below="@id/img1"
android:text="fade"
android:layout_marginLeft="10dp"

/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/btn2"
android:layout_below="@+id/img1"
android:layout_centerHorizontal="true"
android:text="Zoom"
android:layout_marginLeft="10dp"
/>
<Button
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="@id/img1"
android:layout_marginRight="10dp"
android:id="@+id/btn3"
android:text="Rotate"/>

</RelativeLayout>

fade.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:fromAlpha="1"
android:toAlpha="0"
android:duration="3000"
android:repeatMode="reverse"
android:repeatCount="2"/>
</set>
zoom.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale android:fromXScale="0.2"
android:fromYScale="0.2"
android:toXScale="5.0"
android:toYScale="5.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="3000"
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

android:repeatMode="reverse"
android:repeatCount="2"
/>

</set>

rotate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="3000"
android:repeatMode="reverse"
android:repeatCount="2"/>

</set>

MainActivity.java
package com.example.imageanimation;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

ImageView img;
Button b1,b2,b3;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
img = findViewById(R.id.img1);
b1 = findViewById(R.id.btn1);
b2=findViewById(R.id.btn2);
b3=findViewById(R.id.btn3);

b1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation=
AnimationUtils.loadAnimation(getApplicationContext(),R.anim.fade);
img.startAnimation(animation);
}

});
b2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

Animation animation=
AnimationUtils.loadAnimation(getApplicationContext(),R.anim.zoom);
img.startAnimation(animation);
}

});
b3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation=
AnimationUtils.loadAnimation(getApplicationContext(),R.anim.rotate);
img.startAnimation(animation);
}

});

}
}
OUTPUT:
Fade Zoom
Rotate
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

fade.xml(restart)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:fromAlpha="1"
android:toAlpha="0"
android:duration="3000"
android:repeatMode="restart"
android:repeatCount="2"/>
</set>

zoom.xml(restart)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale android:fromXScale="4.0"
android:fromYScale="4.0"
android:toXScale="2.0"
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

android:toYScale="2.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="3000"
android:repeatMode="restart"
android:repeatCount="2"
/>

</set>

rotate.xml(restart)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate android:fromDegrees="360"
android:toDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="3000"
android:repeatMode="restart"
android:repeatCount="2"/>

</set>

Output:-
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

Fade Zoom Rotate

2. Create an application and apply following animation on the image.


a) Rotate image in anti-clockwise direction.
b) Apply only zoom-in animation
c) On click of a button replace image with new image.

CODE:

activityMain.xml

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


<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

tools:context=".MainActivity">

<ImageView
android:id="@+id/img1"
android:layout_width="match_parent"
android:layout_height="420dp"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="20dp"
android:layout_marginBottom="20dp"
android:src="@drawable/dvk">

</ImageView>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/btn1"
android:layout_below="@id/img1"
android:text="Rotate"
android:layout_marginLeft="10dp"

/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/btn2"
android:layout_below="@+id/img1"
android:layout_centerHorizontal="true"
android:text="Flip Image"
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

android:layout_marginLeft="10dp"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="@id/img1"
android:layout_marginRight="10dp"
android:id="@+id/btn3"
android:text="Zoom"/>

</RelativeLayout>
rotate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate android:fromDegrees="360"
android:toDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="3000"
android:repeatMode="restart"
android:repeatCount="2"/>
</set>

zoom.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale android:fromXScale="0.2"
android:fromYScale="0.2"
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

android:toXScale="5.0"
android:toYScale="5.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="3000"
android:repeatMode="restart"
android:repeatCount="2" />

</set>

MainActivity.java
package com.example.imageanimation;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

ImageView img;
Button b1,b2,b3,b4;

@Override
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

protected void onCreate(Bundle savedInstanceState) {


super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
img = findViewById(R.id.img1);
b1 = findViewById(R.id.btn1);
b2=findViewById(R.id.btn2);
b3=findViewById(R.id.btn3);

b1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation=
AnimationUtils.loadAnimation(getApplicationContext(),R.anim.rotate);
img.startAnimation(animation);
}

});
b3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Animation animation=
AnimationUtils.loadAnimation(getApplicationContext(),R.anim.zoom);
img.startAnimation(animation);

}
Name: Aman Verma MET – Institute of Computer Science
Roll No: 1266

});
b2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
img.setImageResource(R.drawable.vk);
}
});
}
}

OUTPUT:
Rotate (Anticlockwise) FlipImage Zoom In

You might also like