Material Design学习之NavigationView实现侧滑菜单栏

Material Design学习之NavigationView实现侧滑菜单栏 

    接触Material Design已经有一段时间了，但是实际的项目中用到的并不多，平时也没什么时间来仔细研究一下，今天来带大家来看一下Material Design 怎么用NavigationView来实现侧滑菜单栏，大家以前可能大多都在用第三方的SlideMenu库来实现侧滑菜单，现在来看看NavigationView是怎么实现的吧

    1.NavigationView是android-support-design包下的一个控件，所以我要如果要使用这个控件，就必须在as的gradle中添加依赖：

   2.NavigationView的父类容器是DrawrLayout，见下图：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.wangchang.testnavigationview.MainActivity">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="内容区域" />
    </LinearLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigationview"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        app:headerLayout="@layout/header"
        app:menu="@menu/menu" />

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

app：headerlayout指向的是侧滑菜单头部布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#700000ff">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="center"
        android:src="@mipmap/ic_launcher" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="用户头像"/>

</LinearLayout>

app:menu指向的是侧滑菜单选择条目的menu文件

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group android:checkableBehavior="single">
        <item
            android:id="@+id/item1"
            android:icon="@mipmap/ic_launcher"
            android:title="条目1"></item>
        <item
            android:id="@+id/item2"
            android:icon="@mipmap/ic_launcher"
            android:title="条目2"></item>
        <item
            android:id="@+id/item3"
            android:icon="@mipmap/ic_launcher"
            android:title="条目3"></item>
    </group>
</menu>

实现效果：

这样就可以随意滑动了

   3侧滑菜单的点击事件

final DrawerLayout drawerlayout = (DrawerLayout) findViewById(R.id.drawerlayout);
NavigationView navigationview = (NavigationView) findViewById(R.id.navigationview);
navigationview.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
    @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        switch (item.getItemId()) {
            case R.id.item1:
                Toast.makeText(MainActivity.this, "item1", Toast.LENGTH_SHORT).show();
                break;
            case R.id.item2:
                Toast.makeText(MainActivity.this, "item2", Toast.LENGTH_SHORT).show();
                break;
            case R.id.item3:
                Toast.makeText(MainActivity.this, "item3", Toast.LENGTH_SHORT).show();
                break;

        }
        item.setChecked(true);
        drawerlayout.closeDrawers();//关闭抽屉
        return true;
    }
});

好啦，整个过程看着很简单，但想要尝试的兄弟们呢还是要动手敲一下滴，毕竟看花容易绣花难嘛，我也是参考了网上的资料，实地测试的哟，嗯就这样，晚安！