Android XML Pulse Animation not working as expected

Question

I am trying to code an animation that mimics a pulse animation that resembles this:

Concentrate on the inner blue circle (ignore the outer dark blue circle)

http://www.joedubs.com/wp-content/uploads/2016/01/breathe-now.gif

Here's what I managed to code so far:

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <scale
        android:duration="2000"
        android:fromXScale="1"
        android:fromYScale="1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0.8"
        android:toYScale="0.8" />

    <scale
        android:duration="2000"
        android:fromXScale="0.8"
        android:fromYScale="0.8"
        android:pivotX="50%"
        android:pivotY="50%"
        android:startOffset="2000"
        android:toXScale="1.8"
        android:toYScale="1.8" />

    <scale
        android:duration="2000"
        android:fromXScale="1.8"
        android:fromYScale="1.8"
        android:pivotX="50%"
        android:pivotY="50%"
        android:startOffset="2000"
        android:toXScale="1"
        android:toYScale="1" />
</set>

While this works for a certain extent, the animation skips and stutters when it repeats again. Can someone tweak it a bit to mimic a smooth pulse animation? (grow and reduce)

score 1 · Answer 1 · edited Jun 03 '18 at 17:05

You can add a ObjectAnimator like this, creating a pulsating effect in the reverse mode:

ObjectAnimator scaleDown = ObjectAnimator.ofPropertyValuesHolder(ImageView,
                PropertyValuesHolder.ofFloat("scaleX", 0.5f),
                PropertyValuesHolder.ofFloat("scaleY", 0.5f));
        scaleDown.setDuration(300);

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

        scaleDown.start();

Another way to achive that is have a CustomClass and override your OnDraw method, creating a effect of growing or decrease increasing a variable and recalling invalidate(). I did these in another post to make my button background grow, if you want to follow this way it can be useful for you.

Pulsating Button Android

Android XML Pulse Animation not working as expected

1 Answers1