Navigation Box Below Toolbar in Material Design

Question

I want my drawer to open on the left under the toolbar. But, according to aspects of Material Design, this is not very good. But still I want to do it.

Here I have changed my xml file.
--- Relative layout
----- Toolbar
----- Box
------- container
------- box list

here is my xml file. When the application opens, my application crashes. I do not know where I made a mistake, and XML does not show any errors.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <include android:id="@+id/toolbar" layout="@layout/toolbar" /> <android.support.v4.widget.DrawerLayout 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"> <FrameLayout android:id="@+id/container_body" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1" /> <fragment android:id="@+id/fragment_navigation_drawer" android:name="com.myApp.activity.FragmentDrawer" android:layout_width="@dimen/nav_drawer_width" android:layout_height="match_parent" android:layout_gravity="start" app:layout="@layout/fragment_navigation_drawer" tools:layout="@layout/fragment_navigation_drawer" /> </android.support.v4.widget.DrawerLayout> </RelativeLayout> 

Answer 1

Here is the latest material design solution

 <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" tools:openDrawer="start"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="@dimen/abc_action_bar_default_height_material" android:background="?attr/colorPrimary" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/> </android.support.design.widget.AppBarLayout> <android.support.v4.widget.DrawerLayout android:id="@+id/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent"> <!--content_main is my layout you can design your own--> <include layout="@layout/content_main" /> <FrameLayout android:id="@+id/content" layout="@layout/content_main" android:layout_width="match_parent" android:layout_height="match_parent" /> <!-- The navigation drawer --> <android.support.design.widget.NavigationView android:id="@+id/nav_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" app:menu="@menu/activity_main_drawer" /> </android.support.v4.widget.DrawerLayout> </LinearLayout> 

Hope this helps

Answer 2

I created a new XML file main_activity_appbar and added the toolbar first, and in the same layout file I added my drawer layout. and in the mainAcitity.java file I changed the layout of this file.

main_activity_appbar.xml

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <include android:id="@+id/toolbar" layout="@layout/toolbar" /> <android.support.v4.widget.DrawerLayout 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"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <FrameLayout android:id="@+id/container_body" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1" /> </LinearLayout> <fragment android:id="@+id/fragment_navigation_drawer" android:name="com.myApp.activity.FragmentDrawer" android:layout_width="@dimen/nav_drawer_width" android:layout_height="match_parent" android:layout_gravity="start" app:layout="@layout/fragment_navigation_drawer" tools:layout="@layout/fragment_navigation_drawer" /> </android.support.v4.widget.DrawerLayout> </LinearLayout> 

MainActivity.java

 protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main_appbar); 

This works fine.