Material Design Android Ripple Effect

Here’s on how to add a neat Ripple effect for your UI components. I’ll take a button for this.

Create new folder res/drawable-v21 and create a new XML ripple.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/primary_700">
    <item android:drawable="@color/primary_500" />
</ripple>

Add this to your button layout:  android:background="@drawable/ripple"

Note that the Android ripple effect only works on Lollipop versions and above. So you might want to use a normal color selector for previous versions as a fallback.

So set your background to be a regular color selector, and for Lollipop handle it like this in your Activity.java

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
             button.setBackground(getDrawable(R.drawable.ripple));
}

Suleiman

Product Designer who occasionally writes code.

iamsuleiman.com