一、概述
今天，我们来介绍两个和侧滑菜单有关的MD控件：
DrawerLayout：实现侧滑菜单的基础。NavigationView：作为侧滑菜单布局的一种实现方式。
二、DrawerLayout
2.1 基本原理
当我们需要使用到侧滑菜单时，可以通过DrawerLayout来实现，DrawerLayout、侧滑菜单布局、普通布局这三者的关系为：
layout_gravity决定了将哪个菜单作为侧滑布局， DrawerLayout会根据是否声明了 layout_gravity属性，把它内部的直接子 View分成两类： - 对于没有声明
layout_gravity的布局，那么它会将它们当作普通布局，并按照FrameLayout的方式来排列它们。 - 对于声明了
layout_gravity="start"或者layout_gravity="left"的布局，在普通情况下会将它们隐藏起来，当从屏幕的最左侧往右移动手指时，这个布局会渐渐展现出来，对于DrawerLayout的所有子View来说，只允许有一个子View的该属性为start/left，这就是我们的侧滑布局。 layout_gravity="end/right"和上面类似，只不过它的调出是从屏幕的右侧向左侧移动。
2.2 简单事例
下面是一个使用DrawerLayout的最简单的例子：
复制代码
layout_drawer_normal就是侧滑菜单，我们将它的layout_gravity定义为start，按照前面的分析，它应当位于屏幕的左侧：
复制代码
下面是最终的效果：
2.3 监听DrawerLayout的状态变化
如果我们希望监听DrawerLayout状态的变化，那么可以通过下面这个方法：
private Toolbar mToolbar; private ActionBarDrawerToggle mActionBarDrawerToggle; private DrawerLayout mDrawerLayout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_drawer_layout_simple); mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout); mDrawerLayout.addDrawerListener(new DrawerLayout.DrawerListener() { @Override public void onDrawerSlide(View drawerView, float slideOffset) { Log.d("mDrawerLayout", "onDrawerSlide, slideOffset=" + slideOffset); } @Override public void onDrawerOpened(View drawerView) { Log.d("mDrawerLayout", "onDrawerOpened"); } @Override public void onDrawerClosed(View drawerView) { Log.d("mDrawerLayout", "onDrawerClosed"); } @Override public void onDrawerStateChanged(int newState) { Log.d("mDrawerLayout", "onDrawerStateChanged, state=" + newState); } }); }复制代码 其中opened和closed方法都很好理解，就是对应展开和收起，而onDrawerSlide方法中的slideOffset，则对应于DrawerLayout展开的偏移值，全部展开时为1，全部收起时为0，onDrawerStateChanged对应于所处的状态：STATE_IDLE/STATE_DRAGGING/STATE_SETTLING。
三、DrawerLayout和Toolbar结合使用
3.1 Toolbar的NavigationIcon跟随DrawerLayout变化
下面，我们看一下把DrawerLayout和Toolbar相结合，做出下面的效果，让Toolbar的navigationIcon跟随着DrawerLayout变化：
Toolbar的按钮会跟随着进行状态的变化，我们也可以通过点击 Toolbar的按钮来展开和收起侧边栏，首先看我们的布局 复制代码
在Activity中，我们需要将Toolbar和DrawerLayout关联起来：
public class DrawerLayoutActivity extends AppCompatActivity { private Toolbar mToolbar; private ActionBarDrawerToggle mActionBarDrawerToggle; private DrawerLayout mDrawerLayout; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_drawer_layout_under_toolbar); initView(); } private void initView() { mToolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(mToolbar); getSupportActionBar().setDisplayHomeAsUpEnabled(true); //1.决定显示. mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout); mActionBarDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mToolbar, R.string.drawer_open, R.string.drawer_close); //2.传入Toolbar可以点击. mDrawerLayout.addDrawerListener(mActionBarDrawerToggle); //3.监听变化. } @Override protected void onPostCreate(@Nullable Bundle savedInstanceState) { super.onPostCreate(savedInstanceState); //4.同步状态 mActionBarDrawerToggle.syncState(); }}复制代码 这里需要做的有四步工作：
- 将
Toolbar作为ActionBar，并调用Toolbar的setDisplayHomeAsUpEnabled，这样最左边的Icon才可以显示。 - 实例化
ActionBarDrawerToggle，并传入Toolbar和DrawerLayout。 - 通过
DrawerLayout的addDrawerListener方法，让DrawerLayout的状态能够回调到ActionBarDrawerToggle。 - 在
onPostCreate中，调用ActionBarDrawerToggle的syncState方法。
3.2 DrawerLayout覆盖Toolbar
在上面的实现方式中，侧滑菜单位于Toolbar的下方，如果我们希望它覆盖Toolbar，那么可以像下面这样布局：
复制代码
最终的效果为：
3.3 DrawerLayout和Toolbar延伸到状态栏上方
如果我们希望侧滑菜单的区域能够延伸到状态栏，那么可以进行以下三步的修改：
- 第一步：修改
Activity的style，让状态栏透明，并修改状态栏的颜色：
复制代码
- 第二步：给
Activity根布局设置android:fitsSystemWindows="true"属性
复制代码
- 第三步：给侧滑布局设置
android:fitsSystemWindows="true"属性
复制代码
通过以上三步，就可以达到沉浸式状态栏的效果：
四、NavigationView
4.1 Navigation属性
在使用DrawerLayout的时候，我们可以随意定义侧滑菜单的布局，NavigationView其实就是Google推荐的侧滑布局应该有的样子，它的效果类似于下面这样：
Navigation的简单例子： 复制代码
上面app各属性对应到下图中就是这样：
Navigation分为两个部分：头部和列表。 - 头部是
app:headerLayout所指定的布局：
复制代码
- 列表通过
app:menu所指定：
复制代码
menu当中的每个item就对应于列表当中的一项，而item的icon和title则分别对应列表项的图标和文字，如果希望对item进行分组，那么可以采用group的方式来组织menu：
复制代码
不同组之间就会被分割线隔开：
subMenu的方式： 复制代码
4.2 Navigation点击监听
4.2.1 列表点击监听
如果希望处理Navigation中列表的监听，那么可以使用现成的接口，根据item的id来判断是点击的是列表中的哪一项。
mNavigationView = (NavigationView) findViewById(R.id.navigation);mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem item) { Log.d("onSelected", "id=" + item.getItemId()); return true; } });复制代码 4.2.2 头部点击监听
NavigationView并没有提供头部点击的监听回调，因此，我们只能够通过findViewById的方法找到对应的View，对其设置监听，下面是整个headerLayout在NavigationView中的层次：
五、参考文献
更多文章，欢迎访问我的 Android 知识梳理系列：
- Android 知识梳理目录：
- 个人主页：
- 个人知识总结目录：