Android DrawerLayout (with NavigationView) behind status bar

Question

I have an app with a DrawerLayout that contains a NavigationView:

activity_layout.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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/drawer_layout"
    android:fitsSystemWindows="true">

    <android.support.constraint.ConstraintLayout
        android:id="@+id/activity_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context="com.exmaple.appname.activityname">

        <android.support.v7.widget.Toolbar
            android:id="@+id/actionbar_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            android:elevation="4dp"
            android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
            app:popupTheme="@style/Theme.AppCompat"/>

        […]

    </android.support.constraint.ConstraintLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:menu="@menu/nav_drawer"
        android:fitsSystemWindows="true"/>

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

I have added the following styles as well:

styles.xml:

<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
    […]

    <item name="windowActionBar">false</item>
    <item name="android:windowNoTitle">true</item>
</style>

values-21/styles.xml:

<style name="AppTheme.NoActionBar" parent="AppTheme">
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

All of this code is based on the Google I/O Schedule App, however the DrawerLayout still does not render behind the status bar. Any ideas as to why this combination of solutions isn't working and what solutions might? I've found that drawing behind the status bar is never a one-size-fits-all solution, but after trying every combination of solutions on Stack Overflow that I can think of, I still can't get it.

Current drawer image:

Answer 1

Just add <item name="android:windowTranslucentStatus">true</item> in values-21/styles.xml and remove this <item name="android:statusBarColor">@android:color/transparent</item>

add android:fitsSystemWindows="true" to your NavigationView in xml

Working example!

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:windowTranslucentStatus">true</item>
</style>

Result

Edited (main layout)

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    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" <--This is mandatory 
    tools:context=".ui.activities.MainActivity">

    <FrameLayout
        android:id="@+id/frame_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white" />

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/colorPrimary"
        android:fitsSystemWindows="true" /><--This is mandatory 

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

Current Result

Update: I lookup your style-v21 and found below

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme.NoActionBar" parent="AppTheme">
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:windowTranslucentStatus">true</item>
    </style>
</resources>

Please replace it with this

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:windowTranslucentStatus">true</item>
</style>