How do I add elevation (shadow) to my BottomNavigationView. It doesn't come by default

Question

I tried setting elevation from xml and programmatically both. But nothing works.

Have you upgraded to 25.0.1? Elevation was mentioned as a fixed issue for that release https://developer.android.com/topic/libraries/support-library/revisions.html — Lewis McGeary, Nov 23 '16 at 14:28
If you have upgraded to 25.0.1 but it still doesnt work may be it is because it was not supported for older versions devices!! — Xenolion, Nov 23 '16 at 16:23
I am using 25.1.0 and still not seeing a default elevation. Any ideas? — lostintranslation, Jan 29 '17 at 00:39

score 36 · Answer 1 · answered Feb 24 '17 at 15:53

It only works if you set white as android:background in the BottomNavigationView.

This is my code and it's working:

<android.support.design.widget.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:background="@color/white"
    app:elevation="8dp"
    app:itemIconTint="@color/bottom_color_state"
    app:itemTextColor="@color/bottom_color_state"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintHorizontal_bias="0.52"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:menu="@menu/bottom_navigation_main" />

score 3 · Answer 2 · answered Nov 23 '16 at 16:32

3

I got the solution. You need to add background attribute along with elevation else it wont show the shadow.

answered Nov 23 '16 at 16:32

Javed Khatri

719
2
7
9

4

Post your code for solution which is worked for you. thanks. – Gopal Jan 24 '17 at 10:05
Please show your code for this solution, because it is not working for me. – Sev Feb 09 '17 at 18:14

score 1 · Answer 3 · answered Sep 24 '19 at 14:01

This is the only solution that worked for me:

val background = bottomNavigation.background
if (background is MaterialShapeDrawable) {
    background.shadowCompatibilityMode = SHADOW_COMPAT_MODE_ALWAYS
}

as suggested here: https://issuetracker.google.com/issues/124153644#comment2

diAz · Answer 4 · 2020-01-13T12:52:50.817

For those who are interested, I also managed to get some shadow using a background drawable. However, I had to use the color white otherwise it doesn't work...

It can be useful if you want to do angles like I do.

drawable/gnt_rounded_corners_shape.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
  <solid android:color="@android:color/white"/>

  <corners android:bottomRightRadius="0dp"
      android:bottomLeftRadius="0dp"
      android:topLeftRadius="16dp"
      android:topRightRadius="16dp" />
</shape>

and inside layout/main_activity.xml

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="@drawable/gnt_rounded_corners_shape"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu"
        android:elevation="8dp"
        />

result :

score 0 · Answer 5 · answered May 05 '20 at 03:18

0

if you're not using CoordinateLayout with BottomNavigationBar you could just wrap your navigation with a CardView or MaterialCardView and set cardElevation to what you want and cardCornerRadius to zero.

answered May 05 '20 at 03:18

Abed

3,999
1
17
28

How do I add elevation (shadow) to my BottomNavigationView. It doesn't come by default

5 Answers5

Linked