ImageView zoom in, zoom out infinite animation and onAnimationRepeat issue

Question

I would like to build a zoom in and out animation for my ImageView, I set up a listener and set the animation RepeatCount to infinite.

First I start with a zoom in effect, then in the onAnimationRepeat method I create the zoom out part where using a boolean I would like to restart the whole effect starting to zoom in again. But after the first time the onAnimationRepeat is not called again, in turn the animation is repeating but it is stuck at the zoom out part.

What am I missing?

//image animation
        Animation anim = new ScaleAnimation(1.0f, 1.1f, 1.0f, 1.1f);
        anim.setInterpolator(new LinearInterpolator());
        anim.setRepeatCount(Animation.INFINITE);
        anim.setDuration(10000);
        zoomIn = true;

        // Start animating the image
        final ImageView splash = (ImageView) findViewById(R.id.imageView);
        splash.startAnimation(anim);

        anim.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {

            }

            @Override
            public void onAnimationEnd(Animation animation) {
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
                if(zoomIn) {
                    Log.w("", "we zoom out, and zoomIn is: " + zoomIn);
                    Animation anim = new ScaleAnimation(1.1f, 1f, 1.1f, 1f);
                    anim.setInterpolator(new LinearInterpolator());
                    anim.setRepeatCount(Animation.INFINITE);
                    anim.setDuration(10000);
                    splash.startAnimation(anim);
                    zoomIn = false;

                } else if(!zoomIn) {
                    Log.w("", "we zoom in, and zoomIn is: " + zoomIn);
                    Animation anim = new ScaleAnimation(1.0f, 1.1f, 1.0f, 1.1f);
                    anim.setInterpolator(new LinearInterpolator());
                    anim.setRepeatCount(Animation.INFINITE);
                    anim.setDuration(10000);
                    splash.startAnimation(anim);
                    zoomIn = true;
                }


            }
        });


    }

Answer 1

Just switch to ObjectAnimator and use the following:

ObjectAnimator scaleX = ObjectAnimator.ofFloat(btnSubscribe, "scaleX", 0.9f, 1.1f);
ObjectAnimator scaleY = ObjectAnimator.ofFloat(btnSubscribe, "scaleY", 0.9f, 1.1f);

scaleX.setRepeatCount(ObjectAnimator.INFINITE);
scaleX.setRepeatMode(ObjectAnimator.REVERSE);

scaleY.setRepeatCount(ObjectAnimator.INFINITE);
scaleY.setRepeatMode(ObjectAnimator.REVERSE);

AnimatorSet scaleAnim = new AnimatorSet();
scaleAnim.setDuration(1000);
scaleAnim.play(scaleX).with(scaleY);

scaleAnim.start();

Answer 2

Image view animation sequentially

• initialize i=0
• create different animation objects
• create array of image view id's
• with help of handler decide your time slot
• add your animation file inside anim folder

final Animation animFirst = AnimationUtils.loadAnimation(getActivity(), R.anim.shrink_expand);
final Animation animSecond = AnimationUtils.loadAnimation(getActivity(), R.anim.shrink_expand);
final Animation animThird = AnimationUtils.loadAnimation(getActivity(), R.anim.shrink_expand);


final int[] imageId = new int[]{R.id.step_1, R.id.step_2, R.id.step_3};
final List<Animation> anim = new ArrayList<>();
anim.add(animFirst);
anim.add(animSecond);
anim.add(animThird);


final Handler handler = new Handler();
handler.postDelayed(new Runnable() {


    public ImageView imageView;

    public void run() {
        if (i < imageId.length) {
           imageView= ((ImageView) mBinding.getRoot().findViewById(imageId[i]));
            imageView .startAnimation(anim.get(i));
            anim.get(i).setFillAfter(true);

            i++;
        } else {
            i = 0;
            anim.get(0).setFillAfter(false);
            anim.get(1).setFillAfter(false);
            anim.get(2).setFillAfter(false);

        }
        handler.postDelayed(this, 2000);
    }

}, 500);



}