Draw NavigationView header below status bar with NavigationView behind status bar

Question

I have been trying to draw the NavigationView header below the status bar, but it stays behind the status bar.

I have already set the property android:fitsSystemWindows="true" for both my DrawerLayout as well as my NavigationView, but to no avail.

Here's the XML

<?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/activity_dashboard"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_scrollFlags="scroll|enterAlways|snap">

            </android.support.v7.widget.Toolbar>

            <android.support.design.widget.TabLayout
                android:id="@+id/tab"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:tabMode="scrollable">

            </android.support.design.widget.TabLayout>

        </android.support.design.widget.AppBarLayout>

    </android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@android:color/white"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header" />

</android.support.v4.widget.DrawerLayout>

@RayKoopa add this line android:fitsSystemWindows="false" to drawer layout — bebosh, Oct 15 '17 at 15:44

score 13 · Answer 1 · answered Jan 01 '17 at 22:35

13

I had the same issue, on your NavigationView set fitsSystemWindows to false, leave rest as is. From what I understood from API >= 21 NavigationView goes behind status bar

answered Jan 01 '17 at 22:35

Tuby

3,158
2
17
36

2

doing that makes the NavigationView BELOW the status bar. i dont want this behaviour. i want the NavigationView to draw behind the status bar but the header should be below the status bar. – Asad Tariq Jan 02 '17 at 02:06

Allan Veloso · Answer 2 · 2018-08-22T23:14:24.620

8

Did you try to setFitsSystemWindows to false on the header View?

If you did and it did not work you can set a padding top to your View manually by observing the onApplyWindowInsetsListener on the header View or on the NavigationView:

 ViewCompat.setOnApplyWindowInsetsListener(headerView) { view, insets ->
      view.setPadding(0, insets.systemWindowInsetTop, 0, 0)
      insets
 }

edited Aug 22 '18 at 23:14

answered Aug 22 '18 at 23:02

Allan Veloso

5,823
1
38
36

This worked for me. I needed to keep setFitsSystemWindows as true for other reasons. Thanks! – John Oberhauser Jan 05 '19 at 00:25
This should be the accepted answer, worked like charm. Added the setFitsSystemWindows setted to false in the navigation view that contains the header, and another setFitsSystemWindows setted to true in the drawer layout. – Acemond Feb 27 '20 at 08:01

score 2 · Answer 3 · answered Jan 27 '17 at 14:59

2

Did you try adding android:fitsSystemWindows="true" to the root of your header layout? This worked for me.

answered Jan 27 '17 at 14:59

danwilkie

794
6
10

You can see yourself he has that in his code, which causes his navigation view to be _under_ the statusbar, but not _below_ it. – Ray Sep 21 '17 at 20:19
@RayKoopa No. You can only see the reference to the header layout app:headerLayout="@layout/nav_header" not the content of the header itself. Adding android:fitsSystemWindows="true" on the root view of the header also worked great for me. – Catalin Morosan Oct 29 '18 at 13:18
Then there seems to be different behavior on my and your device, it had to be `false` for me. – Ray Oct 29 '18 at 16:10

Draw NavigationView header below status bar with NavigationView behind status bar

3 Answers3