How to change Floating Action button shadow colour

Question

I want to change Floating Action button shadow colour from black/grey to colorprimary/custom color of shadow ** shadow example like below image with **center blue FAB button with light blue shadow not grey shadow. But we can change the FAB button background color. But as you can see in image there is blue shadow of FAB button .I want to achive that thing.

Answer 1

try this :: app:backgroundTint="@color/colorAccentGrey"

where colorAccentGrey = YourColor

and put xmlns:app="http://schemas.android.com/apk/res-auto" at the beginning of the XML if you forggt,

and for Remove shadow :: app:elevation="0dp"

Hope this will help you.. :)

Answer 2

I think you have 2 options:

1. as @Uttam said, change the elevation of the FAB widget
2. to make a custom design and embed it as an image in your layout as shown here http://androidgifts.com/android-material-design-floating-action-button-tutorial/

Answer 3

None of the answer worked for me. So i worked this. anyhow it will give shadow like effect that enough for me

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_add_black"
        app:elevation="0dp" // disable outside shawdow
        app:borderWidth="30dp" // make borderwidth to 25dp or height of fab
        app:backgroundTint="#00E5FF" // now you will see only this color with shawdow 
        android:backgroundTint="#00E5FF" // since border is 30dp u ll not see this color and if you want to check reduce border width to 25dp then ull see this color in center as a small dot.
        />

Answer 4

A simple solution is to remove the stroke(border-width), the default value is 0.5dp change it to 0dp, that is

app:borderWidth="0dp"

Refer Regular and mini FAB key properties in Material Design documentation!

Link - https://material.io/components/buttons-floating-action-button/android