Tool_Bar with android CardView and Transparent status bar

Question

So, following code is my Main_activity Layout and i need to do something like this with Transparent status bar with first CardView :

Here is what i've try it:

<?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
        android:layout_width="100dp"
        android:layout_height="150dp"
        android:orientation="vertical">
            <include
                android:id="@+id/tool_bar"
                layout="@layout/tool_bar">
            </include>
        <android.support.v7.widget.CardView
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            android:layout_margin="5dp"
            android:id="@+id/view">
            <ImageView
                android:id="@+id/img_thumbnail1"
                android:layout_width="fill_parent"
                android:layout_height="100dp"
                android:scaleType="fitXY"
                android:layout_marginBottom="50dp"/>
        </android.support.v7.widget.CardView>
     </RelativeLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>
    </LinearLayout>
    <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>

How to doing this?

Answer 1

Solved by Adding : android:windowTranslucentStatus

on Styles:

<!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:windowTranslucentStatus">true</item>
    </style>

And toolbar without background:

    <?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=".MainActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:orientation="vertical">

        <android.support.v7.widget.Toolbar
            android:id="@+id/tool_bar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:popupTheme="@style/AppTheme" />

        <android.support.v7.widget.CardView
            android:id="@+id/view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <ImageView
                android:id="@+id/img_thumbnail1"
                android:layout_width="fill_parent"
                android:layout_height="100dp"
                android:layout_marginBottom="50dp"
                android:scaleType="fitXY" />

        </android.support.v7.widget.CardView>
    </RelativeLayout>


    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">


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

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


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

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

Result: