How to make a smooth image rotation in Android?

Question

I'm using a RotateAnimation to rotate an image that I'm using as a custom cyclical spinner in Android. Here's my rotate_indefinitely.xml file, which I placed in res/anim/:

<?xml version="1.0" encoding="UTF-8"?>
<rotate
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:toDegrees="360"
    android:pivotX="50%"
    android:pivotY="50%"
    android:repeatCount="infinite"
    android:duration="1200" />

When I apply this to my ImageView using AndroidUtils.loadAnimation(), it works great!

spinner.startAnimation( 
    AnimationUtils.loadAnimation(activity, R.anim.rotate_indefinitely) );

The one problem is that the image rotation seems to pause at the top of every cycle.

In other words, the image rotates 360 degrees, pauses briefly, then rotates 360 degrees again, etc.

I suspect that the problem is that the animation is using a default interpolator like android:iterpolator="@android:anim/accelerate_interpolator" (AccelerateInterpolator), but I don't know how to tell it not to interpolate the animation.

How can I turn off interpolation (if that is indeed the problem) to make my animation cycle smoothly?

Answer 1

Is it possible that because you go from 0 to 360, you spend a little bit more time at 0/360 than you are expecting? Perhaps set toDegrees to 359 or 358.

Answer 2

You are right about AccelerateInterpolator, you should use LinearInterpolator instead of.

I couldn't find way to refer to android.R.anim.linear_interpolator from animation XML file (android:iterpolator="@android:anim/linear_interpolator" Eclipse highlights as error).

You can create your own XML interpolation file in your project, e.g. name it res/anim/linear_interpolator.xml:

<?xml version="1.0" encoding="utf-8"?>
<linearInterpolator xmlns:android="http://schemas.android.com/apk/res/android" />

And add to you animation XML:

android:iterpolator="@anim/linear_interpolator"

Answer 3

This is an old thread but I'm having the same problem.

Trying to rotate around the center and there is a slight 'blip' in the rotation.

I'm using LinearAccelerator and have trying 0 to 360 and 1 to 360.

I suspect that the rotation is not actually occurring from the center.

Any ideas?