No elevation For FloatingActionButton ( FAB ) in Support Material Design

Question

With the help of this question I built a Floating Action Button to add elements to my Listview

The code is easy:

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    app:backgroundTint="@color/spg_rosa"
    app:borderWidth="0dp"
    app:elevation="4dp"
    app:fabSize="normal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add_white_48dp"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    />

The thing is

app:elevation="4dp"

is not working, I can't see any shadow!

I grab the icon from Google : https://www.google.com/design/icons/

Any idea?

EDIT: I'm using it in Samsung S3 Mini ( API 16 )

Strange, most people report that adding app:borderWidth="0dp" fixes the issue, you already have that. It may be worthwhile waiting for the fix for this issue in the next update of the design support library. Also, it may help someone answer if you mention what API version exhibits this issue for you. See this post for more information http://stackoverflow.com/questions/30532863/how-to-add-shadow-to-the-fab-provided-with-the-android-support-design-library — BrentM, Jun 08 '15 at 21:29

score 6 · Accepted Answer · answered Jun 09 '15 at 18:28

6

I just tested your sample on a Samsung S3 Mini (API 16). For me the elevation works. because the elevation value is so small it's not very visible, try to increase the value. As BrentM says the elevation is not working if app:borderWidth="0dp" is not added.

answered Jun 09 '15 at 18:28

shadow-01

201
1
4

I already tried to increase this value... If it works for you, it must something else... Thanks for your help, I will keep searching! – Juliatzin Jun 09 '15 at 18:33

score 4 · Answer 2 · answered Jun 09 '15 at 18:52

Your problem is the "android:layout_alignParentBottom="true", that means your button is right at the bottom edge, try adding at least 10dp of margin at the bottom and it will fix your problem.

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    app:backgroundTint="@color/spg_rosa"
    app:borderWidth="0dp"
    app:elevation="4dp"
    app:fabSize="normal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add_white_48dp"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:layout_marginBottom="10dp"
    />

Regards!

This helped me. Thanks – Sowmia Sundararajan Aug 11 '15 at 16:14 — Sowmia Sundararajan, Aug 11 '15 at 16:14

score 0 · Answer 3 · answered Jun 18 '15 at 17:21

0

Thing was My Listview were black! I changed color theme to white, and I could see the shadow !

answered Jun 18 '15 at 17:21

Juliatzin

18,455
40
166
325

No elevation For FloatingActionButton ( FAB ) in Support Material Design

3 Answers3