How to add shadow to the FAB provided with the android support design library?

android floating-action-button android-design-library android-appcompat
Rolf ツ picture Rolf ツ · May 29, 2015 · Viewed 39.2k times · Source

The title is pretty self explaining.

The following code does not render shadow below the Floating Action Button. What can be done to render shadow? Is this feature really not supported even on API 21+?

<android.support.design.widget.FloatingActionButton
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@drawable/ic_add"
    android:clickable="true" />

Note: Adding android:elevation does not add shadow on API 21.

Example screenshot

Screenshot taken from the example by dandar3: https://github.com/dandar3/android-support-design

Answer

Dmytro Danylyk picture Dmytro Danylyk · May 29, 2015

Simply setting app:borderWidth="0dp" resolve this issues for me.

Note: don't forget to add xmlns:app="http://schemas.android.com/apk/res-auto" to your root layout.

This issue should be fixed in next release of android design library.

Related questions

FloatingActionButton example with Support Library

Recently, I read these posts: Android Design Support Library Android Support Library, revision 22.2.0 FloatingActionButton But, none of them give me a detail example about creating a new FloatingActionButton. It's so hard to understand, which is why I am asking this …

Read More
Android Design Library - Floating Action Button Padding/Margin Issues

I'm using the new FloatingActionButton from the Google Design Library and I am getting some strange padding/margin problems. This image (with developer layout options on) is from API 22. And from API 17. This is the XML <android.support.design.…

Read More
FloatingActionButton doesn't hide

I am trying to hide my FloatingActionButton fabLocation programmatically with : fabLocation.setVisibility(View.GONE) but it does not work. If I add android:visibility="gone" in my XML layout, fabLocation is hidden when I run my activity but it reappears …

Read More