有图有真相

wKiom1O2AbOyJlPhAACtJFuAuEc706.jpg

wKioL1O2AYSSNnf1AADep5S8NbI884.jpg

wKioL1O2AYTD7MJhAADlB5oghZE645.jpg

下载地址:http://down.51cto.com/data/1417895

右侧的布局和左侧一致,关键在于android:layout_gravity="end"/"start"

xml如下:

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

   <!--页面视图  -->
    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

  <!--左边滑出视图  -->
    <ListView
        android:id="@+id/left_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#111"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="0dp" />
    
  <!--右边滑出视图  end\start 区分左右视图-->
    <LinearLayout
        android:id="@+id/right_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="end"
        android:background="#111" >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent" 
            android:text="anthoer page"
            >
        </TextView>
    </LinearLayout>

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


                      视图的操作关键点:


            mDrawerLayout.setDrawerShadow(R.drawable.ic_launcher,

Gravity.RIGHT);

mDrawerLayout.setDrawerListener(myDrawerListener);



                         mDrawerLayout.closeDrawer(Gravity.START);   //关闭左边视图

                         mDrawerLayout.openDrawer(Gravity.START);   //打开左边视图


此抽屉模式在陌陌聊天群里查看群成员里有,用户体验不错,很简单的实现

官方下载demo

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

csdn一篇翻译挺好的
http://blog.csdn.net/tu_bingbing/article/details/9008255