Ripple effect for lollipop views

Question

I have been developing an app for Lollipop (API 21).

When I change the Button color to something, the ripple effect doesn't works.

I found some third party libraries for the ripple effect, but I want to do this with standard API.

This answer didn't help either.

XML:

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="New Button"
    android:id="@+id/button"
    android:layout_below="@+id/textView"
    android:background="@android:color/holo_blue_bright"
    android:layout_alignParentStart="true"
    android:layout_marginTop="76dp"
   />

score 31 · Accepted Answer · answered Nov 21 '14 at 22:22

31

You have to set your button's background to a RippleDrawable which you can define in XML. (I'll name it holo_blue_ripple.xml)

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@android:color/white"> <!-- ripple color -->

    <item android:drawable="@android:color/holo_blue_bright"/> <!-- normal color -->

</ripple>

Then reference it with android:background="@drawable/holo_blue_ripple".

answered Nov 21 '14 at 22:22

Floern

33,559
24
104
119

1

Thanks for helping. But I was wondering how I can apply corner radius with this technique? I have added following lines in the `holo_blue_ripple.xml` but it isn't working: ` ` – Zain Zafar Nov 22 '14 at 06:44
3

I figured the solution. Here is that: ` ` – Zain Zafar Nov 22 '14 at 06:58
8

What to do for Pre-Lollipop versions? – Faizan Mubasher Apr 16 '15 at 11:13
Where to put this xml ? Bcz ripple will not work bellow 21. – Hardik Joshi Dec 17 '15 at 07:02
@Prince you can put it in the `drawable-v21` folder. – Floern Dec 17 '15 at 09:03
how can I programmatically alter the "normal color" in the XML above ? – Someone Somewhere Oct 24 '16 at 21:23

score 27 · Answer 2 · answered Jun 09 '15 at 23:58

27

Try this:

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="?attr/selectableItemBackground"
    ...
 />

Based on this tutorial and the official docs

answered Jun 09 '15 at 23:58

kip2

6,473
4
55
72

1

Unless you want to customize your ripple effect, that's the simplest solution in my opinion. – Mateus Gondim Aug 17 '15 at 11:55
Doesn't work for me :/ Effect is- color change when clicked. My android version is 5.0 only. Could you help? – ugola Jul 06 '17 at 04:16

score 7 · Answer 3 · edited Oct 04 '16 at 16:01

7

Also ?attr/selectableItemBackgroundBorderless canbe used for circular ripple effect.

edited Oct 04 '16 at 16:01

Androiderson

16,865
6
62
72

answered May 20 '16 at 13:35

Meanman

1,474
20
17

Doesn't work for me :/ Effect is- color change when clicked. My android version is 5.0 only. Could you help? – ugola Jul 06 '17 at 04:15

score 1 · Answer 4 · answered Aug 03 '16 at 12:33

1

Try this attribute

android:background="?attr/selectableItemBackground"

This is the simplest way to show ripple effect in your view/layout.

answered Aug 03 '16 at 12:33

swetabh suman

1,949
2
19
24

Doesn't work for me :/ Effect is- color change when clicked. My android version is 5.0 only. Could you help? adding this to a button – ugola Jul 06 '17 at 04:16

Ripple effect for lollipop views

4 Answers4

Linked