Add shadow to BottomNavigationView.

- Adds elevation for API 21+
- Adds a gray divider for older platforms

Bug: 32394780
Change-Id: Ief55f4a7801db103c654c94d1f79e0c63c597201
diff --git a/design/res/values/attrs.xml b/design/res/values/attrs.xml
index 545a82e..41e0c0f 100644
--- a/design/res/values/attrs.xml
+++ b/design/res/values/attrs.xml
@@ -469,6 +469,7 @@
         <attr name="itemIconTint"/>
         <attr name="itemTextColor"/>
         <attr name="itemBackground"/>
+        <attr name="elevation"/>
     </declare-styleable>
 
 </resources>
diff --git a/design/res/values/colors.xml b/design/res/values/colors.xml
index ebf6412..eb18f05 100644
--- a/design/res/values/colors.xml
+++ b/design/res/values/colors.xml
@@ -38,4 +38,6 @@
 
     <color name="design_snackbar_background_color">#323232</color>
 
+    <color name="design_bottom_navigation_shadow_color">#14000000</color>
+
 </resources>
\ No newline at end of file
diff --git a/design/res/values/dimens.xml b/design/res/values/dimens.xml
index 63e98b8..de715ce 100644
--- a/design/res/values/dimens.xml
+++ b/design/res/values/dimens.xml
@@ -59,6 +59,8 @@
     <dimen name="design_bottom_sheet_peek_height_min">64dp</dimen>
 
     <dimen name="design_bottom_navigation_height">56dp</dimen>
+    <dimen name="design_bottom_navigation_elevation">8dp</dimen>
+    <dimen name="design_bottom_navigation_shadow_height">1dp</dimen>
     <dimen name="design_bottom_navigation_text_size">12sp</dimen>
     <dimen name="design_bottom_navigation_active_text_size">14sp</dimen>
     <dimen name="design_bottom_navigation_margin">8dp</dimen>
diff --git a/design/res/values/styles.xml b/design/res/values/styles.xml
index c8b9cd5..820742f 100644
--- a/design/res/values/styles.xml
+++ b/design/res/values/styles.xml
@@ -44,6 +44,7 @@
 
     <style name="Widget.Design.BottomNavigationView" parent="">
         <item name="itemBackground">?attr/selectableItemBackgroundBorderless</item>
+        <item name="elevation">@dimen/design_bottom_navigation_elevation</item>
     </style>
 
     <style name="Base.Widget.Design.TabLayout" parent="android:Widget">
diff --git a/design/src/android/support/design/widget/BottomNavigationView.java b/design/src/android/support/design/widget/BottomNavigationView.java
index 266c4a1..352e136 100644
--- a/design/src/android/support/design/widget/BottomNavigationView.java
+++ b/design/src/android/support/design/widget/BottomNavigationView.java
@@ -18,6 +18,7 @@
 
 import android.content.Context;
 import android.content.res.ColorStateList;
+import android.os.Build;
 import android.support.annotation.DrawableRes;
 import android.support.annotation.NonNull;
 import android.support.annotation.Nullable;
@@ -25,6 +26,8 @@
 import android.support.design.internal.BottomNavigationMenu;
 import android.support.design.internal.BottomNavigationMenuView;
 import android.support.design.internal.BottomNavigationPresenter;
+import android.support.v4.content.ContextCompat;
+import android.support.v4.view.ViewCompat;
 import android.support.v7.content.res.AppCompatResources;
 import android.support.v7.view.SupportMenuInflater;
 import android.support.v7.view.menu.MenuBuilder;
@@ -35,6 +38,7 @@
 import android.view.Menu;
 import android.view.MenuInflater;
 import android.view.MenuItem;
+import android.view.View;
 import android.view.ViewGroup;
 import android.widget.FrameLayout;
 
@@ -138,6 +142,10 @@
             mMenuView.setItemTextColor(
                     createDefaultColorStateList(android.R.attr.textColorSecondary));
         }
+        if (a.hasValue(R.styleable.BottomNavigationView_elevation)) {
+            ViewCompat.setElevation(this, a.getDimensionPixelSize(
+                    R.styleable.BottomNavigationView_elevation, 0));
+        }
 
         int itemBackground = a.getResourceId(R.styleable.BottomNavigationView_itemBackground, 0);
         mMenuView.setItemBackgroundRes(itemBackground);
@@ -148,6 +156,9 @@
         a.recycle();
 
         addView(mMenuView, params);
+        if (Build.VERSION.SDK_INT < 21) {
+            addCompatibilityTopDivider(context);
+        }
 
         mMenu.setCallback(new MenuBuilder.Callback() {
             @Override
@@ -285,6 +296,18 @@
         boolean onNavigationItemSelected(@NonNull MenuItem item);
     }
 
+    private void addCompatibilityTopDivider(Context context) {
+        View divider = new View(context);
+        divider.setBackgroundColor(
+                ContextCompat.getColor(context, R.color.design_bottom_navigation_shadow_color));
+        FrameLayout.LayoutParams dividerParams = new FrameLayout.LayoutParams(
+                ViewGroup.LayoutParams.MATCH_PARENT,
+                getResources().getDimensionPixelSize(
+                        R.dimen.design_bottom_navigation_shadow_height));
+        divider.setLayoutParams(dividerParams);
+        addView(divider);
+    }
+
     private MenuInflater getMenuInflater() {
         if (mMenuInflater == null) {
             mMenuInflater = new SupportMenuInflater(getContext());
diff --git a/samples/SupportDesignDemos/res/layout/design_bottom_navigation_view.xml b/samples/SupportDesignDemos/res/layout/design_bottom_navigation_view.xml
index c868430..3add119 100644
--- a/samples/SupportDesignDemos/res/layout/design_bottom_navigation_view.xml
+++ b/samples/SupportDesignDemos/res/layout/design_bottom_navigation_view.xml
@@ -64,6 +64,6 @@
             android:layout_width="match_parent"
             android:layout_height="56dp"
             android:layout_gravity="bottom"
-            android:background="#eee"
+            android:background="#fafafa"
             app:menu="@menu/sample_bottom_menu"/>
 </FrameLayout>