Beautiful circular reveal animation on Android

Hello everyone! This is my first post on Medium.

Today I want to share with you how to create a beautiful User Interface using a Circular Reveal Animation.

To perform this animation I used createCircularReveal from ViewAnimationUtils available on API 21

https://developer.android.com/reference/android/view/ViewAnimationUtils.html

Animator createCircularReveal (View view, 
                int centerX, 
                int centerY, 
                float startRadius, 
                float endRadius)
Returns an Animator which can animate a clipping circle.

view is the view we want to animate.
centerX and centerY are the starting points of the animation, relative to a view.
startRadius and endRadius are the radius of the animated circle.

So, if we want to show an animated circle starting from bottom right, we set x and y of the main layout and the startRadius at 0.
Thanks to Pythagoras we could calculate the exact point of the endRadius, using the hypotenuse function.

Get the full source code from my github at:

https://github.com/danieleorlando/CircularReveal

Don’t hesitate to comment below if you have any questions :)

If this tutorial is useful, please share it and follow me for next tutorials!