Search code examples
javaandroidanimationandroid-animationobjectanimator

ObjectAnimator with Infinite rotation stutters


I have an animator, infinite_rotation, defined as:

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <objectAnimator
        android:propertyName="rotation"
        android:repeatCount="infinite"
        android:valueFrom="0"
        android:valueTo="360"
        android:duration="2000" />
</set>

When the time (time is indefinite) comes that I no longer need this, I call infinite_animator.cancel(). Then play a fade_out animation on its layout container:

<set xmlns:android="http://schemas.android.com/apk/res/android">
        <objectAnimator
            android:propertyName="alpha"
            android:repeatCount="0"
            android:valueTo="0.0"
            android:duration="1000" />
</set>

The resulting animation is that, the rotation stops as expected but stutters while fading out. What am I missing?

Here is how it looks:

enter image description here

UPDATE: I was testing the above problem on old Samsung Tab 4 with Kitkat OS. I just tested on a fairly newer Samsung Tab 4 with Marshmallow OS. The animation works fine. So I guess the better question is how do I fix the sloppy animation on my older device/OS?

This is the animation call:

private void animateRefreshButton() {
    ImageView iv_refresh = (ImageView) findViewById(R.id.iv_refresh);

    if(infinite_animator == null) {
        infinite_animator = AnimatorInflater.loadAnimator(this, R.animator.refresh_rotate);
    }
    infinite_animator.setTarget(iv_refresh);
    infinite_animator.start();
}

hideRefreshButton() is initiated when the app determines refresh is complete. This is the call to cancel and fade out animation:

private void hideRefreshButton() {
    if(infinite_animator != null) {
        infinite_animator.cancel();
    }

    Animator anim = AnimatorInflater.loadAnimator(this, R.animator.refresh_fadeout);
    anim.addListener(new Animator.AnimatorListener() {
        @Override
        public void onAnimationStart(Animator animation) {}

        @Override
        public void onAnimationEnd(Animator animation) {
            framelayout_container_of_iv_refresh.setVisibility(View.GONE);
        }

        @Override
        public void onAnimationCancel(Animator animation) {}

        @Override
        public void onAnimationRepeat(Animator animation) {}
    });
    anim.setTarget(framelayout_container_of_iv_refresh);
    anim.start();
}

Solution

  • Personally I do not use Animation API because of the "problems" it has. Instead, I would go with Animators API in this case.

    Have this snippet:

    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            View view = findViewById(R.id.imageView);
    
            ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(view, View.ROTATION, 0.0f, 360.0f);
    
            objectAnimator.setDuration(2000);
            objectAnimator.setRepeatCount(Animation.INFINITE);
            objectAnimator.setInterpolator(new LinearInterpolator());
    
            objectAnimator.addListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationCancel(Animator animation) {
                    view.animate()
                            .alpha(0.0f)
                            .setDuration(1000);
                }
            });
    
            objectAnimator.start();
    
            view.setOnClickListener((v) -> objectAnimator.cancel());
    
        }
    
    

    Then this will be the output:

    enter image description here


    I've tested on emulator (API 19): works as expected.