List of items behind header when scrolling in DrawerLayout

Question

Can someone help me fix this ? I do not understand why my list of items are going behind the header of my DrawerLayout when I scroll down.

<?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="start">

    <include
        layout="@layout/activity_MainActivity"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

        <android.support.design.widget.NavigationView
            android:id="@+id/nav_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:background="#6b6b6b"
            android:fitsSystemWindows="true"
            android:theme="@style/NavigationTheme"
            app:headerLayout="@layout/format_appdrawerheader"
            app:itemBackground="@drawable/nav_view_item_background"
            app:itemTextColor="@drawable/nav_view_item_textcolor"
            app:menu="@menu/category_menu">

            <include layout="@layout/format_appdrawerheader" />

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

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

Thank's for your help

EDIT : It will be easier to understand with picture.

So, when my app is launched, my NavigationView looks like that. The darker part is the header, and the lighter part is a list made with a menu. When is scroll down, only the lighter part is moving (which is exactly what I want), but it's sliding under the header. So if I click on a blank space in my header like in the second picture (the frame in red), it selected the item behind, in this example, the "Item 1".

Answer 1

Edit2

The pictures are helpfull.

You could try to add the next line to the top part of your format_appdrawerheader.xml:

android:clickable="true"

It should trap the click event in the header, preventing it from continuing to the view behind the header.

Below I'll show where to put that line if you would use the default Navigation Drawer Activity from Android Studio. You may have to tailor it to your app.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="@dimen/nav_header_height"
    android:background="@drawable/side_nav_bar"
    android:gravity="bottom"
    android:orientation="vertical"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:theme="@style/ThemeOverlay.AppCompat.Dark"
    android:clickable="true">
...

Note the last line

I hope this helps. Please let me know.

Edit

Another solution could be to remove this line:

<include layout="@layout/format_appdrawerheader" />

It is already referenced a few lines higher:

app:headerLayout="@layout/format_appdrawerheader"

Original answer

I haven't tested it yet, but judging by your description you may need to add the NoActionBar themes to your styles.xml and AndroidManifest.xml.

styles.xml:

<style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
</style>

AndroidManifest.xml:

<activity
            android:name=".MainActivity"
            android:theme="@style/AppTheme.NoActionBar">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
</activity>

Please let me whether this helpful or if you run into errors. I don't know how you've set up your MainActivity.java. If you run into a NullPointerException with regard to an ActionBar, you have to make additional modifications to your project. You could take a look at the code in the default NavigationDrawer Activity if you start a new project in Android Studio. In addition to the styles.xml and AndroidManifest.xml you could look at the way the toolbar is referenced in the MainActivity.java and how app_bar_main.xml is set up.