Android笔记：Material Design系列之DrawerLayout和NavigationView应用

前言

从事Android开发近4年，在工作中根据开发需求不断的去学习新的东西。有些东西用过之后很长时间都没有继续使用，渐渐忘差不多了。再次使用的时候，去翻之前的笔记和demo发现记录的不全，导致自己的学习成本变的很高。所有打算自己把之前用过的做一个详细的笔记，方便自己。
现在有个新项目需要自己完成，就以此为契机，按照项目的需求以此记录更新该系列，第一部分介绍Design Support Library里用到的相关内容。

Material Design

Material Design，中文名：材料设计语言，是由Google推出的全新的设计语言，Google为Android推出了适用于Material Design的兼容库（Design Support Library）

使用DrawerLayout和NavigationView

gradle引入implementation 'com.android.support:design:26.1.0'

使用Android studio新建project时有一个选项提供模板生成Navigation Drawer Activity，可以大大减少我们的工作量，但是为了讲解如何使用，没有采用此方法，新建空白的Activity。

在xml里添加DrawerLayout和NavigationView

DrawerLayout为根布局，其中有两个子layout：分别是FrameLayout和NavigationView；FrameLayout展示主页面的内容，NavigationView展示抽屉的内容
NavigationView关键属性讲解
android:layout_gravity="start"start从屏幕左方滑出，end从屏幕右侧滑出；如果没有该属性打开页面直接显示抽屉内容，点击报错。
app:headerLayout="@layout/layout_nav_header"NavigationView头部布局，用于展示信息
app:menu="@menu/drawer"菜单选项，用于展示菜单

layout_nav_header.xm

menu/drawer.xml

Activity中java代码

public class MainActivity extends AppCompatActivity implements NavigationView.OnNavigationItemSelectedListener{

    private DrawerLayout mDrawerLayout;
    private NavigationView mNavigationView;


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

        initView();
        mNavigationView.setNavigationItemSelectedListener(this);
        openFragment(HomeFragment.newInstance());//

    }

    private void initView() {
        mDrawerLayout = (DrawerLayout) findViewById(R.id.layout_drawer);
        mNavigationView = (NavigationView) findViewById(R.id.view_navigation);
        /*去掉navigation中的滑动条*/
        mNavigationView.getChildAt(0).setVerticalScrollBarEnabled(false);
    }


    @Override
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {
        String title = (String) item.getTitle();
        //int itemId = item.getItemId();
        Toast.makeText(MainActivity.this, "点击了 " + title, Toast.LENGTH_SHORT).show();

        item.setChecked(true);//
        mDrawerLayout.closeDrawer(mNavigationView);

        return true;
    }
}

使用其他布局替代NavigationView

上边完美实现了抽屉效果。但是在实际使用过程中，Navigation抽屉布局不能满足我们的需求，例如像qq侧滑抽屉，底部有按钮，不能使用NavigationView；

微信截图_20180103172511.png

只需要用合适的布局替代NavigationView即可，不能缺少android:layout_gravity="start"属性

和ToolBar实现联动

Android提供了Toolbar替代ActionBar

implementation 'com.android.support:appcompat-v7:26.1.0'support:appcompat-v7提供Toolbar

修改theme，取消Actionbar

使用Theme.AppCompat.Light.NoActionBar作为父Style

修改activity_main.xml，DrawerLayout不能继续作为根布局

代码修改

private Toolbar toolbar;
 /*创建一个Drawerlayout和Toolbar联动的开关*/
 private ActionBarDrawerToggle toggle;

        initView:
        toolbar = findViewById(R.id.toolbar);
         /*设置ActionBar*/
        setSupportActionBar(toolbar);
        /*显示Home图标*/
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        /*设置Drawerlayout的开关,并且和Home图标联动*/
        toggle = new ActionBarDrawerToggle(this, mDrawerLayout, toolbar, 0, 0);
        mDrawerLayout.addDrawerListener(toggle);
        /*同步drawerlayout的状态*/
        toggle.syncState();

至此常用的Drawerlayout和NavigationView实现方法讲解完毕，后续会添加在使用过程中遇到的问题和根据特殊需求实现的定制。