Elevation not working on android.support.design.widget.FloatingActionButton

8.2k views Asked by At

I've just started android development and trying the new material design. Here is a screenshot of my mainactivity which has a FloatingActionButton but it doesnt applying any elevation (no shadows).

How can I enable shadow on this new widget (android.support.widget.FloatingActionButton).

This is code from layout xml

<android.support.design.widget.FloatingActionButton
        android:id="@+id/add_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:src="@drawable/ic_add_action"
        android:layout_margin="16dp"
        android:elevation="10dp"
        android:padding="10dp"/>

Any help appreciated. Thanks

Please note I'd like to use android design library only not any other github libraries.

4

There are 4 answers

3
Martin Cazares On BEST ANSWER

After a lot of research, I've found the proper way to use FAB with no issues. Use the code below as template:

<android.support.design.widget.FloatingActionButton
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/your_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginBottom="@dimen/floating_button_margin_bottom"
        android:layout_marginRight="@dimen/floating_button_margin_right"
        app:elevation="@dimen/floating_button_elevation"
        app:borderWidth="0dp"
        app:rippleColor="@color/your_ripple_color"
        app:backgroundTint="@color/your_bg_color" />
0
Anggrayudi H On

Your XML layout might missed these code:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   app:xmlns="http://schemas.android.com/apk/res-auto"
   ... >
         <android.support.design.widget.FloatingActionButton
            ... 
            app:borderWidth="0dp"
            app:elevation="4dp" />
   ... 
</RelativeLayout>

EDIT

For more information about FloatingActionButton, see this post, which explains the issue and design guide.

0
shadow-01 On

I'm just testing the floating action button now. And for me it works.

Try adding app:borderWidth="0dp" for your button, this might solve the problem. I saw in some other posts that it might be a problem in the design library.

0
Taras Vovkovych On

Check the manifest file and delete the next properties:

 android:hardwareAccelerated="false"
 android:largeHeap="true"