您的位置:首页 > 移动开发 > Android开发

DrawerLayout的使用

2016-01-06 19:00 429 查看
          DrawerLayout翻译过来就是抽屉布局,网易云音乐和知乎首页都是采用的这种布局。可以简单实现侧滑菜单的功能。

          在使用之前需要在Build.gald中加入compile'com.android.support:design:23.1.1'

   在布局中的使用:

<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/drawer_ly"> <!--抽屉布局-->
<RelativeLayout android:id="@+id/top_rly"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="70dp"
android:fitsSystemWindows="true"
android:background="@color/colorPrimary"
app:title=" ">
<TextView
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_gravity="center" android:text="抽屉布局"
android:textColor="#ffffff"/>
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent" android:layout_height="match_parent"
android:layout_below="@+id/toolbar" android:gravity="center" >
<ImageView
android:layout_width="200dp" android:layout_height="200dp"
android:background="@mipmap/cheese_5" android:scaleType="centerCrop" />
</LinearLayout>
</RelativeLayout>
<!--伸缩菜单-->
<android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="match_parent" android:layout_height="match_parent"
android:fitsSystemWindows="true" android:layout_gravity="left"
app:headerLayout="@layout/left_menu_layout"
app:menu="@menu/menu_main" >
<!-- <TextView
android:layout_width="match_parent" android:layout_height="100dp"
android:text="头衔" android:layout_gravity="top"
android:background="@color/colorPrimary" android:gravity="center"
android:textColor="#ffffff"/>-->
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>



          如图:top_rly是展示的内容布局,nav_view是可伸缩的侧滑菜单。在nav_view中,我们为其添加了一个menu和headerlayout,这两个是用于展示菜单的栏目和头布局的。

   left_menu_layout的布局如下:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="70dp"
android:fitsSystemWindows="true" android:background="@color/colorPrimary"
android:gravity="bottom" android:paddingLeft="10dp"
android:paddingBottom="5dp">
<ImageView android:id="@+id/image"
android:layout_width="40dp" android:layout_height="40dp"
android:background="@mipmap/ic_launcher"/>
<TextView android:id="@+id/nick_tv"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_below="@+id/image" android:textColor="#ffffff"
android:text="昵称" />
</RelativeLayout>
   menu_main的文件如下:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:id="@+id/topPanel" >
<item android:title="菜单1" android:id="@+id/menu1"
android:icon="@mipmap/ic_dashboard" android:checked="false" />
<item android:title="菜单2" android:id="@+id/menu2"
android:icon="@mipmap/ic_forum" android:checked="false" />
<item android:title="菜单3" android:id="@+id/menu3"
android:icon="@mipmap/ic_event" android:checked="false" />
</group>
</menu>
   我们看在代码中的实现:

//关闭抽屉
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.menu1:
Toast.makeText(MainActivity.this, "点击菜单1", Toast.LENGTH_SHORT).show();
break;
case R.id.menu2:
Toast.makeText(MainActivity.this, "点击菜单2", Toast.LENGTH_SHORT).show();
break;
case R.id.menu3:
Toast.makeText(MainActivity.this, "点击菜单3", Toast.LENGTH_SHORT).show();
break;
}
drawerLayout.closeDrawers();
return true;
}
});
}

//打开抽屉
@Override
public void onClick(View v) {
drawerLayout.openDrawer(GravityCompat.START);
}
     差不多就这样吧,下班啦~~~

    可参考:抽屉布局的使用
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  android