导航栏NavigationView

NavigationView

1、NavigationView

NavigationView是专为配合DrawerLayout的侧边栏使用的。关于DrawerLayout这里不多说了，详细用法参考我的另一篇博客抽屉布局DrawerLayout

在布局文件中添加NavigationView，作为DrawerLayout的侧边栏拉出。注意属性layout_gravity="start",从左侧屏幕边缘拉出导航菜单。

<?xml version="1.0" encoding="utf-8"?>

<androidx.drawerlayout.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:layout_width="match_parent"
    android:layout_height="match_parent">
    
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </LinearLayout>
    
    //在布局文件中添加NavigationView，作为DrawerLayout的侧边栏拉出
    <com.google.android.material.navigation.NavigationView
        android:layout_width="250dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/navigation_header"
        app:menu="@menu/navigation_menu" />
        
</androidx.drawerlayout.widget.DrawerLayout>

2、headerLayout

2.1、添加headerLayout

NavigationView为我们继承了一些通用的布局界面，headerLayout就是导航栏顶部的头部区域。在布局中添加app:headerLayout属性

app:headerLayout="@layout/navigation_header"

一个简单的headerLayout布局如下，就是普通的布局，作为headerLayout载入NavigationView：

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        
        <ImageView
            android:id="@+id/header_icon"/>
            
        <TextView
            android:id="@+id/header_name"/>
            
    </LinearLayout>

2.2、获取headerLayout

通过NavigationView对象可以获取到添加的headerLayout布局View，在通过该View就可以findViewById获取到View中的控件进行各种操作。

View headLayout = mLeftNavigationView.getHeaderView(0);

通过NavigationView拿到HeaderView布局之后，就可以得到里面的控件进一步进行操作。

//得到headerLayout中的TextView
    TextView name = headLayout.findViewById(R.id.header_name);

3、菜单Menu

3.1、添加Menu

还有导航栏众多的菜单按钮，也是在布局中添加定义好的menu/菜单,通过属性app:menu引入。

app:menu="@menu/navigation_menu"

菜单定义在menu/文件夹下，可以定义单独的item，也可以定义一组相关的菜单group，如果需要分割线一定要给分组group添加id，否则不会出现分割线！

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    //单个菜单项
    <item
        android:id="@+id/menu_title"
        android:title="菜单" />
    
    //一组菜单，一定要加id才会有分割线    
    <group android:id="@+id/menu_group">
        <item
            android:id="@+id/menu_switch"
            android:title="Switch"
            app:actionLayout="@layout/switch_item"
            app:showAsAction="never" />
        <item
            android:id="@+id/menu_4g
            android:title="4G"/>
    </group>
    
</menu>

3.2、获取Menu

从NavigationView对象可以获取到添加的Menu菜单

//获取Menu菜单
    Menu menu = mLeftNavigationView.getMenu();

3.3、获取MenuItem

关于Menu菜单的操作这里简单介绍一下：

在菜单xml文件中定义的每个菜单item都有id，通过id去寻找对应的菜单项：

MenuItem menuItem= menu.findItem(R.id.menu_title);

可以给MenuItem菜单项添加点击监听器：

menuItem.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
        @Override
        public boolean onMenuItemClick(MenuItem item) {
            //
            return true;
        }
    });

3.4、获取MenuItem中的控件

对于稍微复杂点的MenuItem，比如前面含有SwitchButton的菜单。先获取到ActionView，就是在定义该item是添加的actionLayout属性，指定了Layout布局：

<item
            android:id="@+id/menu_switch"
            android:title="Switch"
            app:actionLayout="@layout/switch_item"/>

其中的switch_item单独定义在一个布局中：

<RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        
        <Switch
            android:id="@+id/switch_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true" />
            
    </RelativeLayout>

通过MenuItem可以得到该布局：

RelativeLayout relativeLayout = (RelativeLayout) menuItem.getActionView();

既然得到布局了，接下来就简单了，获取到布局中的View不难：

Switch switchButton = (Switch) relativeLayout.findViewById(R.id.switch_button);
    //操作吧！
    boolean isChecked = switchButton.isChecked();