Create following XML files under /res/anim/ folder.
accelerate_decelerate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator">
<translate
android:fromYDelta="-100%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
accelerate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_interpolator">
<translate
android:fromYDelta="-100%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
anticipate_overshoot.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/anticipate_overshoot_interpolator">
<translate
android:fromYDelta="-80%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
anticipate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/anticipate_interpolator">
<translate
android:fromYDelta="-80%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
bounce.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/bounce_interpolator">
<translate
android:fromYDelta="-100%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
cycle.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/cycle_interpolator">
<translate
android:fromYDelta="-50%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
decelerate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator">
<translate
android:fromYDelta="-100%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
linear.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/linear_interpolator">
<translate
android:fromYDelta="-100%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
overshoot.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/overshoot_interpolator">
<translate
android:fromYDelta="-80%p"
android:toYDelta="0"
android:duration="2000"/>
</set>
Modify main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="vertical"
android:gravity="bottom"
android:layout_margin="30dp">
<ImageView
android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="@drawable/ic_launcher"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<Button
android:id="@+id/acceleratedecelerate"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Accelerate_Decelerate"/>
<Button
android:id="@+id/accelerate"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Accelerate"/>
<Button
android:id="@+id/anticipate"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Anticipate"/>
<Button
android:id="@+id/anticipateovershoot"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Anticipate_Overshoot"/>
<Button
android:id="@+id/bounce"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Bounce"/>
<Button
android:id="@+id/cycle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Cycle"/>
<Button
android:id="@+id/decelerate"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Decelerate"/>
<Button
android:id="@+id/linear"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Linear"/>
<Button
android:id="@+id/overshoot"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Overshoot"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Main Activity:
package com.exercise.AndroidAnimInterpolator;
import android.app.Activity;
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 AndroidAnimInterpolatorActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
final Animation animAccelerateDecelerate = AnimationUtils.loadAnimation(this, R.anim.accelerate_decelerate);
final Animation animAccelerate = AnimationUtils.loadAnimation(this, R.anim.accelerate);
final Animation animAnticipate = AnimationUtils.loadAnimation(this, R.anim.anticipate);
final Animation animAnticipateOvershoot = AnimationUtils.loadAnimation(this, R.anim.anticipate_overshoot);
final Animation animBounce = AnimationUtils.loadAnimation(this, R.anim.bounce);
final Animation animCycle = AnimationUtils.loadAnimation(this, R.anim.cycle);
final Animation animDecelerate = AnimationUtils.loadAnimation(this, R.anim.decelerate);
final Animation animLinear = AnimationUtils.loadAnimation(this, R.anim.linear);
final Animation animOvershoot = AnimationUtils.loadAnimation(this, R.anim.overshoot);
final ImageView image = (ImageView)findViewById(R.id.image);
Button btnAccelerateDecelerate = (Button)findViewById(R.id.acceleratedecelerate);
Button btnAccelerate = (Button)findViewById(R.id.accelerate);
Button btnAnticipate = (Button)findViewById(R.id.anticipate);
Button btnAnticipateOvershoot = (Button)findViewById(R.id.anticipateovershoot);
Button btnBounce = (Button)findViewById(R.id.bounce);
Button btnCycle = (Button)findViewById(R.id.cycle);
Button btnDecelerate = (Button)findViewById(R.id.decelerate);
Button btnLinear = (Button)findViewById(R.id.linear);
Button btnOvershoot = (Button)findViewById(R.id.overshoot);
btnAccelerateDecelerate.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animAccelerateDecelerate);
}});
btnAccelerate.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animAccelerate);
}});
btnAnticipate.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animAnticipate);
}});
btnAnticipateOvershoot.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animAnticipateOvershoot);
}});
btnBounce.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animBounce);
}});
btnCycle.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animCycle);
}});
btnDecelerate.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animDecelerate);
}});
btnLinear.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animLinear);
}});
btnOvershoot.setOnClickListener(new Button.OnClickListener(){
@Override
public void onClick(View arg0) {
image.startAnimation(animOvershoot);
}});
}
}
Download the files.
Updated@2015-10-19:
- Interpolator effect on ObjectAnimator
12 comments:
Hey dude nice post
Really helped me a lot
Thanks.
Great post!!! thankyou it helps me a lot! :D
wow.. great tutorial!!
Nice work!really clear and helpful!
thumbs up!
it's very very great work...
thanks for sharing this one
Thank you! Great tutorial!
But why the animation on my phone seem to be lagged.
awesome post..cleared everything about interpolator
Nice tutorial!.. Helped a lot!
Really a fun to learn post
HI
It helps me a lot, is it possible to scale the image after the animation complected
how to move object in curve path by given x,y points
anyone help me
thanks
@vv, Did you found a better solution to scale down the image before animation get completed?
Post a Comment