I've tried searching SO a few hours and couldn't find anything relating to what I want. Most questions are in relations to making the Navigation Drawer appear behind the status bar.
However, this isn't the behavior that I want.
I want the status bar to remain opaque over the Drawer, but is transparent over the DrawerLayout container (the fragment).
Here's what I have:
And here's what I want:
I can get the status bar to be translucent over other activities, except for the main activity which has the DrawerLayout. Because everytime I try to make the status bar translucent only the Drawer can become translucent, which is exactly the opposite of what I want for the Drawer. The status bar should only be translucent over the fragment.
Any ideas how I can achieve this?
activity_main.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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:openDrawer="start"
android:fitsSystemWindows="true">
<!-- This FrameLayout is the container for all other fragments
so I want this to have a transparent status bar because some fragments
may have "cover photos" that needs to take up the status bar. It looks
nicer that way. I tried playing around with the fragment layouts
themselves. Bit nothing seems to budge, so I give up on that part. -->
<FrameLayout
android:id="@+id/main_fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
<android.support.design.widget.NavigationView
android:fitsSystemWindows="false"
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/activity_main_nav_header_main"
app:menu="@menu/activity_main_drawer"/>
</android.support.v4.widget.DrawerLayout>
fragment_profile.xml (one of the fragment to be placed inside the container)
<?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"
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.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:id="@+id/card_cover"
android:layout_width="match_parent"
android:layout_height="200dp"
app:cardElevation="10dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#11b4ff"
android:src="@android:drawable/sym_def_app_icon"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="@+id/card_profile"
android:layout_below="@id/card_cover"
android:layout_width="120dp"
android:layout_height="120dp"
app:cardElevation="10dp"
android:layout_marginLeft="15dp"
android:layout_marginBottom="15dp"
android:layout_marginTop="-60dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#1119ff"
android:src="@android:drawable/sym_def_app_icon"
/>
</android.support.v7.widget.CardView>
<TextView
android:layout_margin="15dp"
android:layout_below="@id/card_cover"
android:layout_toRightOf="@id/card_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Profile Name"
android:textSize="30sp"/>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="@+id/fragment_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
app:tabIndicatorColor="@android:color/white"
app:tabIndicatorHeight="6dp"
app:tabMode="scrollable"
app:tabSelectedTextColor="@android:color/white"
app:tabTextColor="@android:color/white"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
v21\styles.xml
<resources>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>
</style>
</resources>