android中抽屉布局DrawerLayout的使用

这个抽屉布局类似于手机QQ的主界面，点击左上角头像，会从界面左侧弹出一个抽屉，展示一些内容。

首先是布局界面activity_main.xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/ThemeOverlay.AppCompat.ActionBar" />

    <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/drawer"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="主界面"
                android:textSize="32dp" />
        </android.support.constraint.ConstraintLayout>

        <android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:background="@android:color/holo_orange_light">

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="菜单界面"
                android:textSize="32dp" />
        </android.support.constraint.ConstraintLayout>
    </android.support.v4.widget.DrawerLayout>

</LinearLayout>

上面这个布局是这样的：

最外面是一个上下结构的LinearLayout，LinearLayout里面有两个组件，一个Toolbar，一个DrawerLayout，也就是本文主要用的组件。

然后DrawerLayout里面是有两个ConstraintLayout，第一个ConstraintLayout代表主界面，第二个ConstraintLayout代表抽屉界面。

 

注意DrawerLayout组件在可视化编辑界面没有，需要手工输入。

 

然后就是java类了MainActivity.java：

package com.example.chenrui.app1;

import android.os.Bundle;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.View;

public class MainActivity extends AppCompatActivity {

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

        Toolbar toolbar = findViewById(R.id.toolbar1);
        setSupportActionBar(toolbar);
        getSupportActionBar().setHomeButtonEnabled(true); //设置返回键可用
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        final DrawerLayout drawerLayout = findViewById(R.id.drawer);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this,drawerLayout,toolbar,R.string.open,R.string.close) {
            @Override
            public void onDrawerOpened(View drawerView) {
                super.onDrawerOpened(drawerView);
            }

            @Override
            public void onDrawerClosed(View drawerView) {
                super.onDrawerClosed(drawerView);
            }
        };
        toggle.syncState();
        drawerLayout.addDrawerListener(toggle);
    }
}

上面代码的相关解释：

1、代码从23-35行主要是添加toolbar标题栏的按钮，通过点击按钮切换抽屉界面的显示和隐藏

注意是35行代码，用的是addDrawerListener方法，用来代替已经过期的setDrawerListener方法

2、显示和隐藏抽屉界面是通过addDrawerListener方法实现的，如果要手工切换抽屉界面的显示和隐藏，可以使用下面的方法：

显示：drawerLayout.openDrawer(Gravity.LEFT);

隐藏：drawerLayout.closeDrawer(Gravity.LEFT);

3、第23行代码中的R.string.open和R.string.close是在资源文件中自定义的，就是显示和隐藏时的提示内容，自己在资源文件中添加一下就可以了

 

执行效果：