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));
}

 

An App developer with an eye for design. Loves to create apps with good UI/ UX that people appreciate. In his spare time, he likes to draw and paint.

Recommended Android Books to Read

Suleiman

An App developer with an eye for design. Loves to create apps with good UI/ UX that people appreciate. In his spare time, he likes to draw and paint.