Transparent background in ImageButton with ripple effect?

Question

I want to programmatically remove the grey background in ImageButton. I tried many method of removing it like -

imageButton.setBackgroundDrawable(null);

but on implementing them, I don't get the ripple effect on the ImageButton on touch. (No highlighting on touch).

Is there any way to remove the background but preserve the ripple effect or highlight.

Possible duplicate of [How to set background highlight to a LinearLayout?](http://stackoverflow.com/questions/8732662/how-to-set-background-highlight-to-a-linearlayout) — rds, Jan 14 '16 at 09:38

score 48 · Accepted Answer · edited May 23 '17 at 12:02

48

If android:background="?attr/selectableItemBackground" this works than I believe this answer should solve your problem:

https://stackoverflow.com/a/28087443/2534007

edited May 23 '17 at 12:02

Community

1
1

answered May 21 '15 at 04:30

Mohib Irshad

1,940
23
18

9

Or even better, ```android:background="?attr/selectableItemBackgroundBorderless"``` – tskulbru May 24 '16 at 18:15
1

This will crash on some devices. – Warpzit Jun 08 '18 at 10:09

score 13 · Answer 2 · edited May 02 '20 at 10:10

13

Create your own RippleDrawable and you need to use mask for the Ripple if you're going to use transparent background.

 <!-- A red ripple masked against an opaque rectangle. -->
 <ripple android:color="#ffff0000">
   <item android:id="@android:id/mask"
         android:drawable="@android:color/white" />
 </ripple>

edited May 02 '20 at 10:10

vepzfe

4,217
5
26
46

answered May 25 '15 at 07:16

Malvin

692
5
8

1

` requires API level 21 (current min is 17)` all the good stuff is obviously going to be useful in a few years when users have upgraded... – Someone Somewhere Oct 02 '17 at 17:10

score 0 · Answer 3 · answered Jun 25 '18 at 09:31

To have a transparent background with ripple effect, the background Drawable needs to be a rippleDrawable, which can be transparent. Set it up programmatically like this.

var mask = new android.graphics.drawable.GradientDrawable();
mask.setShape(android.graphics.drawable.GradientDrawable.RECTANGLE);
mask.setColor(0xFF000000); // the color is irrelevant here, only the alpha
mask.setCornerRadius(5); // you can have a rounded corner for the effect

var rippleColorLst = android.content.res.ColorStateList.valueOf(
    android.graphics.Color.argb(255,50,150,255) // set the color of the ripple effect
);

// aaaand
var ripple = new android.graphics.drawable.RippleDrawable(rippleColorLst,null,mask);
yourImageButton.setBackground(ripple);

(Sorry for the JavaScript/NativeScript code, hope everyone can understand it)

Transparent background in ImageButton with ripple effect?

3 Answers3

Linked