侧滑菜单的简单实现（DrawerLayout+Toolbar+NavigationView）

最新推荐文章于 2024-07-31 19:51:57 发布

原创最新推荐文章于 2024-07-31 19:51:57 发布 · 733 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android

Android学习专栏收录该内容

24 篇文章

订阅专栏

本文介绍了一种使用Android的DrawerLayout和NavigationView实现侧滑菜单的方法。通过代码和XML布局展示了如何创建一个带有导航抽屉的基本应用，包括Toolbar、NavigationView的配置及菜单项点击事件的处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

效果图

这里写图片描述

主布局

<?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:id="@+id/dl_main_drawer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="ceo.yangqing.meimaobing.rxjar.MainActivity">

    <!--<include layout="@layout/content"></include>-->

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

        <android.support.v7.widget.Toolbar
            android:id="@+id/toobar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="#1cf4be"></android.support.v7.widget.Toolbar>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#48c8d4"
            android:gravity="center"
            android:text="我是内容"
            android:textAlignment="center"
            android:textColor="#fff"
            android:textSize="34dp"/>
    </LinearLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigationview"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/activity_main_drawer"
        />

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

NavigationView简单分析

<android.support.design.widget.NavigationView
    android:id="@+id/navigationview"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    app:headerLayout="@layout/nav_header"
    app:menu="@menu/activity_main_drawer"
    />

NavigationView分两部分：
headerLayout：
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/nav_login"
            android:icon="@drawable/ic_menu_send"
            android:title="登录"/>
        <item
            android:id="@+id/nav_change"
            android:icon="@drawable/ic_menu_slideshow"
            android:title="切换"/>

    </group>

    <item android:title="Communicate">
        <menu>
            <item
                android:id="@+id/nav_setting"
                android:icon="@drawable/ic_menu_manage"
                android:title="设置"/>
        </menu>
    </item>

</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.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.widget.ImageView;
import android.widget.Toast;

import butterknife.ButterKnife;
import butterknife.InjectView;
import rx.Observer;


public class MainActivity extends AppCompatActivity {
    public Observer<String> observer;
    @InjectView(R.id.toobar)
    Toolbar mToobar;
    @InjectView(R.id.navigationview)
    NavigationView mNavigationview;
    @InjectView(R.id.dl_main_drawer)
    DrawerLayout mDlMainDrawer;
    private ImageView mImageView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.inject(this);
        initView();
        initListener();
    }


    private void initView() {
        setSupportActionBar(mToobar);
        getSupportActionBar().setDefaultDisplayHomeAsUpEnabled(true);
        ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(this, mDlMainDrawer, mToobar, R.string.open, R.string.close);
        actionBarDrawerToggle.syncState();
        mDlMainDrawer.setDrawerListener(actionBarDrawerToggle);
    }



    private void initListener() {
        mNavigationview.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                mDlMainDrawer.closeDrawers();
                switch (item.getItemId()) {
                    case R.id.nav_login:
                        Toast.makeText(MainActivity.this, "登录", Toast.LENGTH_LONG).show();
                        break;
                    case R.id.nav_setting:
                        Toast.makeText(MainActivity.this, "设置", Toast.LENGTH_LONG).show();
                        break;
                    case R.id.nav_change:
                        Toast.makeText(MainActivity.this, "换肤", Toast.LENGTH_LONG).show();
                        break;
                }
                return true;
            }
        });

    }

}