How to Animate a Fab button (zoom in/out) continuously?

Question

I Want to create this type of animation on FloatingActionButton

What I have tried

public void animFab() {

    ObjectAnimator s         


        

Answer 1

You are seeing "Field requires API 21" Studio lint errors for the following lines of code the app aborts when running on Lollipop.

ObjectAnimator translationZ = ObjectAnimator.ofFloat(fab, View.TRANSLATION_Z, from, to);
ObjectAnimator translationZBack = ObjectAnimator.ofFloat(fab, View.TRANSLATION_Z, to, from);
PathInterpolator pathInterpolator = new PathInterpolator(path);

As you know, these features were introduced in API 21 and not available to earlier APIs and that's why you are seeing these errors. You can, however, get a path interpolator from the support library using PathInterpolatorCompat.

Helper for creating path-based [Interpolator](https://developer.android.com/reference/android/view/animation/Interpolator.html) instances. On API 21 or newer, the platform implementation will be used and on older platforms a compatible alternative implementation will be used.

I don't think that you will need a solution for the "z" translation. (I really don't see any difference between having it and not, but that could be just me. Anyway, the FAB already has a shadow for the height effect.)

Here is a rework of animFab() with some changes to accommodate APIs before 21. Make sure you snag the PathInterpolatorCompat from the v4 support library. First a video showing the code working on an API 19 emulator:

public void animFab() {  

    ObjectAnimator scaleX = ObjectAnimator.ofFloat(fab, View.SCALE_X, from, to);  
    ObjectAnimator scaleY = ObjectAnimator.ofFloat(fab, View.SCALE_Y, from, to);  
    AnimatorSet set1 = new AnimatorSet();  

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {  
        ObjectAnimator translationZ = ObjectAnimator.ofFloat(fab, View.TRANSLATION_Z, from, to);  
        set1.playTogether(scaleX, scaleY, translationZ);  

    } else {  
        set1.playTogether(scaleX, scaleY);  
    }  
    set1.setDuration(500);  
    set1.setInterpolator(new AccelerateInterpolator());  
    set1.addListener(new AnimatorListenerAdapter() {  
        @Override  
  public void onAnimationEnd(Animator animation) {  

        }  
    });  

    Path path = new Path();  
    path.moveTo(0.0f, 0.0f);  
    path.lineTo(0.5f, 1.3f);  
    path.lineTo(0.75f, 0.8f);  
    path.lineTo(1.0f, 1.0f);  
    Interpolator pathInterpolator = PathInterpolatorCompat.create(path);  

    AnimatorSet set2 = new AnimatorSet();  
    ObjectAnimator scaleXBack = ObjectAnimator.ofFloat(fab, View.SCALE_X, to, from);  
    ObjectAnimator scaleYBack = ObjectAnimator.ofFloat(fab, View.SCALE_Y, to, from);  

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {  
        ObjectAnimator translationZBack = ObjectAnimator.ofFloat(fab, View.TRANSLATION_Z, to, from);  
        set2.playTogether(scaleXBack, scaleYBack, translationZBack);  
    } else {  
        set2.playTogether(scaleXBack, scaleYBack);  
    }  
    set2.setDuration(500);  
    set2.setInterpolator(pathInterpolator);  

    final AnimatorSet set = new AnimatorSet();  
    set.playSequentially(set1, set2);  

    set.addListener(new AnimatorListenerAdapter() {  
        @Override  
  public void onAnimationEnd(Animator animation) {  
            super.onAnimationEnd(animation);  
            set.start();  
        }  
    });  
    set.start();  
}

Another possibility is to use AnimatedVectorDrawableCompat for the drawable animation, but that would be a complete rewrite.