Process of adding a ripple effect or animation to buttons or views in Android Studio

How To Add Ripple Effect/Animation To Button or Any Views in Android Studio

Adding custom ripple effect to your button, layout, card view, or any other views will make your app look more professional and gorgeous. It will give instant touch feedback to the users.
So, in the article, we will show you how to add a custom ripple effect. But Note that this won’t show any effects for APIs before 23.

It’s going to be much easy, so keep patience and follow the steps.

Step 1 – Creating A Drawable Resource File For Custom Ripple Effect

Expand the ‘res‘ folder. Select the ‘Drawable‘ folder from Android Studio and click the right mouse button. Then select ‘New‘ and then Click ‘Drawable Resource File‘.

Now, name it ‘custom_ripple_effect‘. Then, select ‘Version‘ from the Available Qualifiers list on the left side and click on ‘>>‘ to take it to the right side.

Now, write ‘21‘ value for the Platform API Level and click ‘OK

Then remove all the existing codes. Now, we are going to use ripple code for the ripple effect:

<?xml version="1.0" encoding="utf-8"?>
<ripple
xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/colorAccent">>
//change '@color/colorAccent' with your desired color
</ripple>

So, now jump into the next step.

Step 2 – Adding Ripple Effect In Button or Any View

Now, in your Button or View, set any background color you like. Then, we need to make sure our view is focusable and clickable. To do so, we will add these two attributions:

android:clickable="true"
android:focusable="true"

We are going to set the drawable resource file as the Foreground of the Button or View. So, add this attribution to your Button or View:

android:foreground="@drawable/custom_ripple_effect"

Congratulations!

You have successfully added Ripple Effect/Animation to your Button or other Views in Android Studio.

Thanks For Allowing Us To Help You 🙂
If you are confused or want to know something, then let us know in the comment box, we will reach you as soon as possible. Don’t Forget To Subscribe our Newsletter, YouTube Channel, and Like Our Facebook Page To Keep Updated With Awesome Things. Follow us on Twitter to stay updated with the latest news & changes.

Was this helpful?

Mahedi Zaman Zaber

I'm a Driven and ambitious individual who is currently pursuing a Bachelor of Science in Computer Science and Engineering. With a passion for innovation and a desire to make a lasting impact, I aspire to become a distinguished software engineer and entrepreneur.

More Reading

Post navigation