Android--NavigationView+DrawerLayout实现侧滑（仿QQ）

1、首先导包

[java] view
plain copy

 print?

compile 'com.android.support:design:26.1.0'  

2、使用NavigationView

首先在主布局文件中使用DrawerLayout作为外包装，里面包含一个主页面和侧滑的菜单页面，而侧滑菜单页面用NavigationView实现，drawerLayout中包含了主页面和侧滑的菜单页面：

<?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/activity_na"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.app.ui.MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/blue"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="@+id/main_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/mm"
android:background="@color/blue"

android:layout_margin="20dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Demo"
android:textColor="#ffffff"
android:textSize="20sp"
android:layout_marginLeft="16dp"/>
<ImageView
android:id="@+id/search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/three"
android:background="@color/blue"
android:layout_margin="20dp"/>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="主页"
android:textSize="22sp"
android:gravity="center"/>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="@+id/nav"
android:layout_gravity="left"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:headerLayout="@layout/head"
app:menu="@menu/new_menu"

>

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

head.xml

<?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:gravity="center"
android:background="@color/blue"
>
<ImageView
android:id="@+id/person"
android:layout_width="72dp"
android:layout_height="72dp"
android:layout_marginTop="42dp"
android:src="@drawable/touxiang"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:layout_marginTop="24dp"
android:textColor="#ffffff"
android:text="超宇"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:layout_marginTop="12dp"
android:textColor="#ffffff"
android:layout_marginBottom="18dp"
android:text="不忘初心，方得始终."/>
</LinearLayout>

<?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/favorite"
android:icon="@drawable/huiyuan"
android:checkable="true"
android:title="    会员"/>

</group>
<item
android:id="@+id/wallet"
android:icon="@drawable/money"
android:title="    钱包"/>
<item
android:id="@+id/photo"
android:icon="@drawable/xiangce"
android:title="    相册"/>
<item
android:id="@+id/dress"
android:icon="@drawable/zhuangban"
android:title="    装扮"/>
<item
android:id="@+id/file"
android:icon="@drawable/wenjian"
android:title="    文件"/>

</menu>

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.NavigationView;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.AppCompatActivity;
import android.view.MenuItem;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

private DrawerLayout drawerLayout;
private NavigationView navigationView;
ImageView menu;
LinearLayout contentView ;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

drawerLayout = (DrawerLayout) findViewById(R.id.activity_na);
navigationView = (NavigationView) findViewById(R.id.nav);
menu= (ImageView) findViewById(R.id.main_menu);
View headerView = navigationView.getHeaderView(0);//获取头布局
menu.setOnClickListener(this);
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
//item.setChecked(true);
Toast.makeText(MainActivity.this,item.getTitle().toString(),Toast.LENGTH_SHORT).show();
drawerLayout.closeDrawer(navigationView);
return true;
}
});
//为DrawerLayout控件添加监听器
drawerLayout.addDrawerListener(new DrawerLayout.SimpleDrawerListener() {
//当侧滑菜单正在滑动时触发的方法
/**
第一个参数：正在滑动的侧滑菜单
第二个参数：菜单滑动的宽度的百分比
**/
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
//获得侧滑菜单的宽度
int drawerViewWidth = drawerView.getMeasuredWidth();
//根据滑动百分比计算内容部分应该向右边移动的距离
int marginLeft = (int)(drawerViewWidth * slideOffset) ;
//获得内容部分的View对象（内容View对象是第一个，所以是0）
contentView = (LinearLayout) drawerLayout.getChildAt(0);
//修改内容部分的左边距
contentView.setLeft(marginLeft);
//解决DrawerLayout不能全屏滑动的问题,displayWidthPercentage传 1，即可实现全屏滑动。
// 如果你想让右侧菜单也是全屏，只要将对应的 "mLeftDragger" 改为 "mRightDragger"
setDrawerLeftEdgeSize(MainActivity.this,drawerLayout,1);
}
});
}

@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.main_menu://点击菜单，跳出侧滑菜单
if (drawerLayout.isDrawerOpen(navigationView)){
drawerLayout.closeDrawer(navigationView);
}else{
drawerLayout.openDrawer(navigationView);
}
break;
}
}

@Override
public void onPointerCaptureChanged(boolean hasCapture) {

}

private void setDrawerLeftEdgeSize (Activity activity, DrawerLayout drawerLayout, float displayWidthPercentage) {
if (activity == null || drawerLayout == null) return;
try {
// 找到 ViewDragHelper 并设置 Accessible 为true
Field leftDraggerField =
drawerLayout.getClass().getDeclaredField("mLeftDragger");//Right
leftDraggerField.setAccessible(true);
ViewDragHelper leftDragger = (ViewDragHelper) leftDraggerField.get(drawerLayout);

// 找到 edgeSizeField 并设置 Accessible 为true
Field edgeSizeField = leftDragger.getClass().getDeclaredField("mEdgeSize");
edgeSizeField.setAccessible(true);
int edgeSize = edgeSizeField.getInt(leftDragger);

// 设置新的边缘大小
Point displaySize = new Point();
activity.getWindowManager().getDefaultDisplay().getSize(displaySize);
edgeSizeField.setInt(leftDragger, Math.max(edgeSize, (int) (displaySize.x *
displayWidthPercentage)));
} catch (NoSuchFieldException e) {
} catch (IllegalArgumentException e) {
} catch (IllegalAccessException e) {
}
}

}

以上的此外，侧滑菜单头布局也可以设置点击事件，通过View head=navigtionview.getHeaderView实现，这里的点击事件我没有写，这里我还将状态栏的颜色改成了标题栏的颜色，达到整体的界面协调。具体实现方法可以参考文章http://blog.csdn.net/s1674521/article/details/59480114

思考如何关闭手势滑动？NavigationView的确没有相关关闭侧滑手势的属性，但是别忘了，drawerLayout却可以，通过以下属性可以关闭滑动手势操作：
在android抽屉开发中，需要关闭手势滑动，来滑出弹出框

mDrawer_layout.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED)//关闭手势滑动

mDrawer_layout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED);//打开手势滑动

NavigationView Item图标不显示原始颜色解决办法：

navigationView.setItemIconTintList(null);