Android uses Drawerlayout to create left and right two drawer menus

There is a drawer view control drawerlayout in Android Support.v4. Using this control, you can create a good experience by swiping open or close menus horizontally on the screen.

Recently in the project, the design has been useful to this effect, but the left and right sides can draw such a menu effect. Using the discovery, in the XML layout and code, almost add the same code, you can achieve the effect of the two menus.

As follows:

Left Pull out Menu:

650) this.width=650; "src=" http://s3.51cto.com/wyfs02/M00/45/BC/wKioL1PqO2qAdhROAAFVeVvcljs115.jpg "style=" float: none; "title=" left menu "alt=" Wkiol1pqo2qadhroaafvevvcljs115.jpg "/>

Pull the menu effect on the right:

650) this.width=650; "src=" http://s3.51cto.com/wyfs02/M01/45/BC/wKioL1PqO2rxFo0UAAFHz2zoAC0127.jpg "style=" float: none; "title=" right Menu "alt=" Wkiol1pqo2rxfo0uaafhz2zoac0127.jpg "/>

The concrete implementation method is as follows, unifies the code file, shares with everybody:

1. 
   

   1. Home Page layout file:

<?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/main_drawer_layout "     Android:layout_width= "Match_parent"     android:layout_height= "Match_parent"      android:background= "@android: Color/transparent"  >    < Relativelayout        android:id= "@+id/main_content_frame_parent"         android:layout_width= "Match_parent"          android:layout_height= "Match_parent"          Android:background= "@android: Color/transparent"  ><!--  The main content of the lower level display  -->         <framelayout &nBsp;          android:id= "@+id/main_content_frame"              android:layout_width= "Match_parent"              android:layout_height= "Match_parent"              android:background= "@android: Color/white"             android:scrollbars= "Vertical"   >        </framelayout>    </ relativelayout><!--  Left slide bar  -->    <RelativeLayout         android:id= "@+id/main_left_drawer_layout"          android:layout_width= "240DP"         android:layout_height= "Match_parent"         android:layout_gravity= "Start"         android: Background= "@android: Color/transparent"         android:paddingtop= " 50DP  >    </RelativeLayout>    <!--  Right slide bar   -->    <relativelayout        android:id= "@+ Id/main_right_drawer_layout "        android:layout_width=" 240DP "         android:layout_height= "Match_parent"          android:layout_gravity= "End"         android: Background= "@android: Color/transparent"         android:paddingtop= " 50DP " >    </RelativeLayout></android.support.v4.widget.DrawerLayout>

As above, the use of drawerlayout needs to be referenced in the layout file with the directory, the Drawerlayout label in the V4 package, and the width and height are set to match_parent. The layout of the lower page is used when the actual menu is closed.

While Main_left_drawer_layout and Main_right_drawer_layout are the parent layout for the left and right two drawer menus, it is important to note that in Drawerlayout, Android is started from the left: Layout_gravity= "Start", starting from the right, using android:layout_gravity= "end".

B. Main layout code file:

package com.demo.drawlayout;import android.os.bundle;import  android.support.v4.app.actionbardrawertoggle;import android.support.v4.app.fragmentactivity;import  android.support.v4.app.fragmentmanager;import android.support.v4.app.fragmenttransaction;import  Android.support.v4.widget.drawerlayout;import android.view.view;import android.widget.relativelayout ; import android.widget.textview;public class mainframelayout extends fragmentactivity  {//  Drawer Menu Object private actionbardrawertoggle drawerbar;public drawerlayout  Drawerlayout;private testfragment testfragment;private relativelayout left_menu_layout,  right_xiaoxi_layout;private TextView text; @Overrideprotected  void oncreate (Bundle  ARG0)  {super.oncreate (arg0); Setcontentview (r.layout.main_frame_activity); Initview (); InitEvent ();} Public void initview () {testfragment = new Testfragment (); Fragmentmanager fragmentmanager = getsupportfragmentmanager (); Fragmenttransaction f_transaction = fragmentmanager.begintransaction (); F_transaction.replace ( r.id.main_content_frame_parent, testfragment); F_transaction.commitallowingstateloss (); InitLeftLayout (); Initrightlayout ();} Public void initleftlayout () {drawerlayout =  (drawerlayout)  findviewbyid (R.id.main_ Drawer_layout);//Set Transparent Drawerlayout.setscrimcolor (0x00000000);//left menu left_menu_layout =  (relativelayout )  findviewbyid (r.id.main_left_drawer_layout); View view2 = getlayoutinflater (). Inflate (R.layout.menu_layout, null); text= (TextView) View2.findviewbyid (R.id.text); Text.settext ("Left Test Menu"); Left_menu_layout.addview (VIEW2);} Public void initrightlayout () {//left menu right_xiaoxi_layout =  (relativelayout)   Findviewbyid (r.id.main_right_drawer_layout); View view = getlayoutinflater (). Inflate (r.layout.xiaoxi_lAyout, null); text= (TextView) View.findviewbyid (r.id.text) text.settext ("Right Test Menu"); right_xiaoxi_ Layout.addview (view);} Private void initevent ()  {drawerbar = new actionbardrawertoggle (this,  Drawerlayout, r.drawable.ic_launcher, r.string.open, r.string.close)  {         //menu opens @overridepublic void ondraweropened (View drawerView)  { Super.ondraweropened (Drawerview);}                         //  menu off @overridepublic void ondrawerclosed (View drawerview)  {super.ondrawerclosed (Drawerview);}}; Drawerlayout.setdrawerlistener (Drawerbar);}         //left Menu switch Event public void openleftlayout ()  {if   (Drawerlayout.isdraweropen (left_menu_layout))  {drawerlayout.closedrawer (left_menu_layout);}  else&nbSp {Drawerlayout.opendrawer (left_menu_layout);}}   Right Menu switch Event public void openrightlayout ()  {if  (Drawerlayout.isdraweropen (right_xiaoxi_ Layout))  {drawerlayout.closedrawer (right_xiaoxi_layout);}  else {drawerlayout.opendrawer (Right_xiaoxi_layout);}}}

The code is simple, and the corresponding place has a comment. There's no nagging here.

The main thing to say: The drawer menu switch event is to add the drawer view to the Actionbardrawertoggle switch, clear its switch event to control the menu opening and closing, similarly, a menu needs to register an event, two menu, The menu is also added to this actionbardrawertoggle to manage. It handles the opening and closing of the left and right two menus on its own, without the appearance of simultaneous opening, and this control is designed to be very good.

The rest of the work is that everyone according to their own needs, to write about the contents of the menu and events. In addition, I have seen a post said that the use of Listview,listview in Drawerlayout will not work, this argument seems to be not tenable, at least, in our project, the menu to add a ListView or other common controls, click events will not be affected.

Related code I added in the attachment, interested friends, can download to learn from each other.

This article is from the "Wind Sea" blog, please be sure to keep this source http://fengbohaishang.blog.51cto.com/5106297/1539203