Is there a way, using the NavigationView element of the Google support library, to use elevation on the items inside a NavigationView to achieve something like this:
You can see that the header of the navigation drawer has an elevation, like the footer on the bottom of the view.
I tried to use the "android:elevation" attribute but it seems to not work properly.
Here's my code for the NavigationView at the moment:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="end">
<include
layout="@layout/app_bar_product_list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
android:fitsSystemWindows="true"
app:headerLayout="@layout/nav_header_filters">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:gravity="center|end"
android:padding="16dp"
android:elevation="16dp"
android:orientation="horizontal"
tools:targetApi="lollipop">
<TextView
android:textAppearance="@style/TextAppearance.AppCompat.Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Clear"/>
</LinearLayout>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
Here's the XML file for the header of the navigation view:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorAccent"
android:elevation="8dp"
android:gravity="bottom"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:theme="@style/ThemeOverlay.AppCompat.Light"
tools:targetApi="lollipop">
<android.support.v4.widget.Space
android:layout_width="match_parent"
android:layout_height="@dimen/status_cheat" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/ordina_per"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:textColor="@android:color/white" />
<android.support.v7.widget.AppCompatSpinner
android:id="@+id/spinner_orders"
style="@style/SpinnerStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
As you see elevation doesn't work in this case. How can I solve this?
clipToPadding
andclipChildren
before adding margins to not clip shadows – Brainstorm