Coordinatorlayout + Appbarlayout + Navigationdrawer

I have a layouting problem when combining CoordinatorLayout with an AppBarLayout and a NavigationDrawer. The problem is, that the NavigationDrawer and it's content are hidden behi

Solution 1:

Your CoordinatorLayout is wrapping your DrawerLayout and NavigationView, which means the Coordinator is in control of how everything is laid out. You need to nest the Coordinator inside the drawer, like so:

<android.support.v4.widget.DrawerLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/drawer_layout"android:layout_width="match_parent"android:layout_height="match_parent"android:clickable="true"android:focusableInTouchMode="true"><android.support.design.widget.CoordinatorLayoutxmlns:app="http://schemas.android.com/apk/res-auto"android:id="@+id/overview_coordinator_layout"android:layout_width="match_parent"android:layout_height="match_parent"><android.support.design.widget.AppBarLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"><android.support.v7.widget.Toolbarandroid:id="@+id/toolbar"android:layout_width="match_parent"android:layout_height="?attr/actionBarSize"android:background="?attr/colorPrimaryDark"app:layout_scrollFlags="enterAlways|scroll" /></android.support.design.widget.AppBarLayout><android.support.v4.widget.NestedScrollViewandroid:layout_width="match_parent"android:layout_height="wrap_content"app:layout_behavior="@string/appbar_scrolling_view_behavior"><TextViewandroid:layout_width="match_parent"android:layout_height="wrap_content"android:text="@string/lorem_ipsum_long" /></android.support.v4.widget.NestedScrollView><android.support.design.widget.FloatingActionButtonandroid:id="@+id/overview_floating_action_button"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_margin="16dp"android:clickable="true"android:src="@drawable/ic_add"app:layout_anchor="@id/overview_coordinator_layout"app:layout_anchorGravity="bottom|right|end"app:layout_behavior="@string/fab_onscroll_behavior" /></android.support.design.widget.CoordinatorLayout><android.support.design.widget.NavigationViewandroid:id="@+id/nvView"android:layout_width="wrap_content"android:layout_height="match_parent"android:layout_gravity="start"android:background="@android:color/white"app:headerLayout="@layout/nav_header"app:menu="@menu/navigationdrawer_main" /></android.support.v4.widget.DrawerLayout>

That should sort it out!

Solution 2:

To add on to the previous answer, you can make the DrawerLayout cleaner by moving the CoordinatorLayout+child elements into a separate xml file. And then just use the "include" option to add the file.

<?xml version="1.0" encoding="utf-8"?><android.support.v4.widget.DrawerLayoutxmlns: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"><!-- Widget Coordinator + child elements go here --><includelayout="@layout/app_bar_main"android:layout_width="match_parent"android:layout_height="match_parent" /><android.support.design.widget.NavigationViewandroid:id="@+id/nav_view"android:layout_width="wrap_content"android:layout_height="match_parent"android:layout_gravity="start"android:fitsSystemWindows="true"app:headerLayout="@layout/nav_header_main"app:menu="@menu/activity_main_drawer" /></android.support.v4.widget.DrawerLayout>