Easing effect for rotate animation in android

Question

I am working on animation for spinning wheel for roulette game, for that i want wheel to be spin like real spin(e.g. wheel spin speed should start slowly then speedily and stop slowly)

I know basic rotate animation which i applied, below is my animation XML file code :

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

and in activity :

public class RouletteActivity extends Activity {

Button button_spin;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_roulette);
   button_spin = (Button)findViewById(R.id.btn_spin);
   button_spin.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub


            StartLoading();

            Handler handler = new Handler(); 
            handler.postDelayed(new Runnable() { 
                public void run() {
                    StopLoading();
                } 
            }, 5000);

        }
    });
}

 public void StartLoading() {
    ImageView img_wheel = (ImageView) this.findViewById(R.id.imageView1);
    img_wheel.setImageDrawable(getResources().getDrawable(R.drawable.wheel));
    Animation rotateLoading = AnimationUtils.loadAnimation(this, R.anim.rotate);
    img_wheel.clearAnimation();
    img_wheel.setAnimation(rotateLoading);
}


 public void StopLoading() {
    ImageView img_wheel = (ImageView) this.findViewById(R.id.imageView1);
    if (img_wheel.getAnimation() != null)
    {
        img_wheel.clearAnimation();
        img_wheel.setImageDrawable(getResources().getDrawable(R.drawable.wheel));

    }
}

Please help me to achieve animation like what i want, thank you.

Answer 1

You can modify the behavior of your animation by applying it a Interpolator.
The AccelerateDecelerateInterpolator seems to be the best here.

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

Or much simpler:

yourView.animate().rotation(value).setInterpolator(new AccelerateDecelerateInterpolator()).start();