Fragment layout takes over toolbar and floating button

Question

This is my activity's layout:

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="name.company.newapp.HomeScreen">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay"
        android:id="@+id/bar"
        >

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            android:elevation="4dp"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

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

    <include layout="@layout/content_home_screen"
        android:layout_below="@id/bar"
        android:layout_height="match_parent"
        android:layout_width="match_parent" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_dialog_email" />

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

This is what is included (content_home_screen)

<?xml version="1.0" encoding="utf-8"?>
    <android.support.v4.widget.DrawerLayout

        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/DrawerLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:elevation="7dp">

        <RelativeLayout 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:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            tools:context="name.company.newapp.HomeScreen"
            tools:showIn="@layout/activity_home_screen">

            <FrameLayout
                android:id="@+id/your_placeholder"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>

        </RelativeLayout>

        <android.support.v7.widget.RecyclerView
            android:id="@+id/RecyclerView"
            android:layout_width="320dp"
            android:layout_height="match_parent"
            android:layout_gravity="left"

            android:background="#ffffff"
            android:scrollbars="vertical">

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

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

My problem is that the place_holder takes over the screen(all of it). I can't see the floating button or the layout bar. I have no idea on how to make this work except making only one layout and not including any content.

Answer 1

As far as I read you have to something like this:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="name.company.newapp.HomeScreen">
<include layout="@layout/content_home_screen"
    android:layout_below="@id/bar"
    android:layout_height="match_parent"
    android:layout_width="match_parent" />

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay"
    android:id="@+id/bar"
    >

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:elevation="4dp"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/ic_dialog_email" />

Your question it's very similar to this: Fragment overlaps my AppCompat toolbar