Android button elevation shadow not working

Question

I am trying to make a button that has a shadow using elevation with a background image being my sign in with gmail png. The button is contained within a relative layout. The elevation won't show no matter what I try to do. I tried solutions from other forum questions and none worked.

Here is my code for the button

<Button
    android:id="@+id/google"
    android:layout_width="270dp"
    android:layout_height="38dp"
    android:layout_marginTop="30dp"
    android:layout_centerHorizontal="true"
    android:background="@drawable/google"
    android:elevation="10dp"
    android:layout_below="@id/slogan"/>

The google drawable is a png image that I exported from Adobe XD. Could someone please give me a pointer on what I am doing wrong? Thanks.

Additionally, I realize that if I set the background of the button to android:color/white the shadow appears. So I think the issue is with the png drawable? Does elevation not work with png images? Is there a workaround?

https://stackoverflow.com/questions/27080338/android-5-0-androidelevation-works-for-view-but-not-button — IntelliJ Amiya, Jun 14 '17 at 06:57
@IntelliJAmiya As I said, I already looked through the forums. Setting stateListAnimator to null for the button and clipToPadding to false for the layout still doesn't make the shadow appear. Am I doing something wrong? — Jeffrey Chou, Jun 14 '17 at 07:01
@Jeffrey Chou Background covers elevation view as well. That's why. — Nitin Patel, Jun 14 '17 at 07:27
@kevanaghera I tried your workaround and it works. Thanks. But, I am wondering if that is the only workaround or the easiest. It is a hassle to put each button in a card view. — Jeffrey Chou, Jun 14 '17 at 07:38
@NitinPatel So besides putting each button in a cardview, how would I work around that? — Jeffrey Chou, Jun 14 '17 at 07:39
Try this link if it works:- https://stackoverflow.com/a/38724984/7806873 — Nitin Patel, Jun 14 '17 at 07:40
I ran my emulator at API level 25. I also set the minimum API level in gradle to 21. — Jeffrey Chou, Jun 14 '17 at 07:04
Damn it, I assumed in Android Studio in 2021 I won't have such issues :(( — Michael, Sep 05 '21 at 15:34

score 10 · Accepted Answer · edited Aug 22 '19 at 13:01

10

Use below the line of code to show an elevation in button

android:outlineProvider="bounds" – K. Sopheak

That works, thanks!

edited Aug 22 '19 at 13:01

BlackBlind

772
9
26

answered Jun 23 '17 at 09:12

Jeffrey Chou

331
2
4
15

4

For me this one resulted in strange background behaviour but android:outlineProvider="paddedBounds" was the key. – Shyri Apr 09 '18 at 12:21
1

for me it works only with: elevation, translationZ, outlineProvider=bounds, stateListAnimator=@null – Ultimo_m Aug 23 '18 at 14:40

score 2 · Answer 2 · answered Jan 17 '21 at 16:06

2

For Material Button, I tried the following and it worked

android:translationZ="5dp"

answered Jan 17 '21 at 16:06

Muhammad Yousuf

127
2
16

score 1 · Answer 3 · answered Jun 14 '17 at 07:19

1

try this I hope it helps, because another view or layout just after your button is hiding shadow

android:layout_marginBottom="16dp"

answered Jun 14 '17 at 07:19

Parth Munjpara

82
6

When I set the background to android:color/white, the shadow appears, so I don't think it is because of another view hiding it – Jeffrey Chou Jun 14 '17 at 07:22

score 0 · Answer 4 · answered Jun 14 '17 at 08:05

Since you're using an image, replace the <Button> tag with that of an <ImageButton>. So, your workaround code would be:

<ImageButton
        android:id="@+id/google"
        android:layout_width="270dp"
        android:layout_height="38dp"
        android:layout_marginTop="30dp"
        android:layout_centerHorizontal="true"
        android:src="@drawable/google"
        android:elevation="10dp"
        android:layout_below="@id/slogan"/>

Take note that the android:src attribute is being used here rather than the android:background attribute.

This one worked for me!

score -1 · Answer 5 · answered Jun 21 '22 at 09:58

-1

try this , I hope this help you ||

android:layout_margin="5dp"

answered Jun 21 '22 at 09:58

Surajkaran Meghwanshi

414
4
16

Android button elevation shadow not working

5 Answers5