Android Navigation drawer-navigation Drawer

Google updated its Google + app in July this year, adopting a new approach to navigation and abandoning navigationdrawer. In the moment, there is a series of discussions about the pros and cons of Navigationdrawer, but for developers we just have to take care of what we need to achieve or learn, 2012 YouTube, Facebook, Path and other applications have used navigationdrawer such a way of navigation, last year Google in order to rectify the increasingly mixed Android, designed the drawer navigation, start the topic or care how to use it:

Page Layout

Look at layout before looking at the layout bar, a common image on the web as follows, an image on the official Android document, the article will give a link at the end:

layout file code:

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android" xmlns:tools= "http// Schemas.android.com/tools "android:layout_width=" match_parent "android:layout_height=" Match_parent "Tools:context = "Com.example.naviganationdrawer.MainActivity" > <android.support.v4.widget.drawerlayout android:id= "@+id/ Mdrawerlayout "android:layout_width=" match_parent "android:layout_height=" match_parent "> <Fram Elayout android:id= "@+id/content_frame" android:layout_width= "Match_parent" android:layou t_height= "Match_parent" > </FrameLayout> <!--navigation Drawer--<listview Android            : id= "@+id/left_drawer" android:layout_width= "120DP" android:layout_height= "Match_parent" android:layout_gravity= "Start" android:background= "@android: Color/holo_red_light" Android:choicemode = "Singlechoice" android:divider= "@Android:color/transparent "android:dividerheight=" 0DP "/> </android.support.v4.widget.DrawerLayout> </RelativeLayout>

Drawerlayout as the interface root control, the first view in Drawerlayout is the main content of the current interface, the second and third view is the contents of the Drawer menu. If the current interface requires only one drawer menu, the third view can be omitted.
The view that displays the main content must be the first child view that must be drawerlayout, because the view order in the XML layout file is the z-ordering order in the Android system, and the drawer must appear above the content.

The display of the picture on the right is a imageview, put the code:

<?xml version= "1.0" encoding= "Utf-8"? ><framelayout xmlns:android= "http://schemas.android.com/apk/res/ Android "    android:layout_width=" match_parent "    android:layout_height=" match_parent ">        < ImageView         android:id= "@+id/content_image"        android:layout_width= "wrap_content"        android:layout_ height= "Wrap_content"        android:src= "@drawable/ic_launcher"        /></framelayout>

Code Implementation

Code implementations in the OnCreate:

    Mplanettitles=new string[]{"Finance", "Technology"};        Mdrawerlist = (ListView) Findviewbyid (r.id.left_drawer);         Mdrawerlist.setadapter (New arrayadapter<string> (this,                Android. R.layout.simple_list_item_1, Mplanettitles));    mdrawerlayout= (drawerlayout) Findviewbyid (r.id.mdrawerlayout);        Mdrawerlist.setonitemclicklistener (New Draweritemclicklistener ());

On the left side of the page is the ListView, where the user selects an entry in the menu list, the system calls Onitemclicklistener's Onitemclick () function , and clicks the event:

Private class Draweritemclicklistener implements Listview.onitemclicklistener {    @Override public    Void Onitemclick (adapterview Parent, view view, int position, long id) {        selectitem (position);    }}

Selected events:

private void SelectItem (int position) {    Fragment Fragment = new Fragmentcontent (mimagelist[position]);    Getsupportfragmentmanager (). BeginTransaction (). replace (R.id.content_frame, fragment). commit ();    Mdrawerlist.setitemchecked (position, true);    Settitle (Mplanettitles[position]);    Mdrawerlayout.closedrawer (mdrawerlist);}

Set caption:

@Overridepublic void Settitle (charsequence title) {    mtitle = title;    Getactionbar (). Settitle (Mtitle);}

The code in the fragementcontent of the picture is displayed on the right:

public class Fragmentcontent extends Fragment {   private int resourceid;public fragmentcontent (int i) {//TODO Auto-gen Erated constructor Stubresourceid=i;} @Overridepublic void onactivitycreated (Bundle savedinstancestate) {//TODO auto-generated method Stubsuper.onactivitycreated (savedinstancestate);} Private View view;private ImageView Mimageview; @Overridepublic view Oncreateview (Layoutinflater inflater, ViewGroup Container,  Bundle savedinstancestate) {//TODO auto-generated method stub view= inflater.inflate ( R.layout.fragmentcontent, NULL); Mimageview = (ImageView) View.findviewbyid (r.id.content_image); Mimageview.setimageresource (resourceId); return view;} @Overridepublic void OnCreate (Bundle savedinstancestate) {//TODO auto-generated method Stubsuper.oncreate ( savedinstancestate);}}

Finally, look at the effect:

Resources:

Http://developer.android.com/design/patterns/navigation-drawer.html

Http://developer.android.com/training/implementing-navigation/nav-drawer.html

Android Navigation drawer-navigation Drawer