Android Studio官方版DrawerLayout侧滑菜单解析

Posted 2020-07-22

效果图如下

这是使用android Studio新建的一个DrawerLayout项目跑出来后的效果(没有Android Studio的盆友赶紧去下载个吧)。

生成后的代码有点混乱，稍微整理一下，那么先看布局文件

activity_main.xml:

<?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/drawer_layout"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    android:fitsSystemWindows="true"  
    tools:openDrawer="start">  
  
    <include  
        layout="@layout/app_bar_main"  
        android:layout_width="match_parent"  
        android:layout_height="match_parent" />  
  
    <android.support.design.widget.NavigationView  
        android:id="@+id/nav_view"  
        android:layout_width="wrap_content"  
        android:layout_height="match_parent"  
        android:layout_gravity="start"  
        android:fitsSystemWindows="true"  
        app:headerLayout="@layout/nav_header_main"  
        app:menu="@menu/activity_main_drawer" />  
  
</android.support.v4.widget.DrawerLayout>

如上在DrawerLayout中引用了app_bar_main.xml，在NavigationView控件中heraderLayout代表的是示例图中侧滑菜单绿色的部位，menu则表示菜单项。

app_bar_main.xml:

<?xml version="1.0" encoding="utf-8"?>  
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true"  
    tools:context="com.lg.slidingmenudemo.MainActivity">  
  
    <android.support.design.widget.AppBarLayout  
        android:layout_width="match_parent"  
        android:layout_height="wrap_content"  
        android:theme="@style/AppTheme.AppBarOverlay">  
  
        <android.support.v7.widget.Toolbar  
            android:id="@+id/toolbar"  
            android:layout_width="match_parent"  
            android:layout_height="?attr/actionBarSize"  
            android:background="?attr/colorPrimary"  
            app:popupTheme="@style/AppTheme.PopupOverlay" />  
  
    </android.support.design.widget.AppBarLayout>  
  
    <include layout="@layout/content_main" />  
  
</android.support.design.widget.CoordinatorLayout>

app_bar_main.xml中可以在Toolbar中设置顶部标题，感觉引用content_main.xml麻烦的话可以直接在里边写布局，删掉content_main.xml即可。

MainActivity:

public class MainActivity extends AppCompatActivity  
        implements NavigationView.OnNavigationItemSelectedListener {  
  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_main);  
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);  
        setSupportActionBar(toolbar);  
  
        //控制侧滑菜单 
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);  
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(  
                this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);  
        drawer.setDrawerListener(toggle);  
        toggle.syncState();  
  
        //设定NavigationView菜单的选择事件 
        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);  
        navigationView.setNavigationItemSelectedListener(this);  
    }  
  
  
    //后退键  
    @Override  
    public void onBackPressed() {  
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);  
        if (drawer.isDrawerOpen(GravityCompat.START)) {  
            drawer.closeDrawer(GravityCompat.START);  
        } else {  
            super.onBackPressed();  
        }  
    }  
  
    @SuppressWarnings("StatementWithEmptyBody")  
    @Override  
    public boolean onNavigationItemSelected(MenuItem item) {  
        int id = item.getItemId();  
  
        if (id == R.id.nav_camera) {  
  
        } else if (id == R.id.nav_gallery) {  
  
        } else if (id == R.id.nav_slideshow) {  
  
        } else if (id == R.id.nav_manage) {  
  
        } else if (id == R.id.nav_share) {  
  
        } else if (id == R.id.nav_send) {  
  
        }  
  
        //关闭侧滑菜单  
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);  
        drawer.closeDrawer(GravityCompat.START);  
        return true;  
    }  
}

自己也可以自定义侧滑菜单的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_camera"  
            android:icon="@drawable/ic_menu_camera"  
            android:title="Import" />  
        <item  
            android:id="@+id/nav_gallery"  
            android:icon="@drawable/ic_menu_gallery"  
            android:title="Gallery" />  
        <item  
            android:id="@+id/nav_slideshow"  
            android:icon="@drawable/ic_menu_slideshow"  
            android:title="Slideshow" />  
        <item  
            android:id="@+id/nav_manage"  
            android:icon="@drawable/ic_menu_manage"  
            android:title="Tools" />  
    </group>  
  
    <item android:title="Communicate">  
        <menu>  
            <item  
                android:id="@+id/nav_share"  
                android:icon="@drawable/ic_menu_share"  
                android:title="Share" />  
            <item  
                android:id="@+id/nav_send"  
                android:icon="@drawable/ic_menu_send"  
                android:title="Send" />  
        </menu>  
    </item>  
  
</menu>

item中的icon为菜单项图标资源ID，title则是菜单项标题(菜单项显示的文本)，可以根据需求自定义

源码地址：http://down.51cto.com/data/2221961

本文出自 “Android开发专栏” 博客，请务必保留此出处http://liuyvhao.blog.51cto.com/11690759/1786857