在 Android 中自定义 Material Navigation Rail

Material Navigation Rail 是 Material Design 中的一种常见导航模式，它位于屏幕底部，可以帮助用户快速切换不同的页面。Android 中已有默认的 NavigationRail 控件，但是我们可以通过自定义来更加方便地满足项目需求。

特征

我们希望自定义的 NavigationRail 具有以下特征：

1. 可以设置导航菜单的图标和文字
2. 可以通过点击菜单项切换页面
3. 可以高亮当前选中的菜单项
4. 可以设置菜单项的背景色和选中颜色

实现步骤

添加依赖

在 build.gradle 文件中添加以下依赖：

dependencies {
    // ...
    implementation 'com.google.android.material:material:1.4.0'
}

布局文件

首先，我们需要在布局文件中添加以下代码：

<com.google.android.material.navigationrail.NavigationRail
    android:id="@+id/navigation_rail"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:menu="@menu/navigation_menu"
    app:backgroundTint="@color/navigation_rail_background_color"
    app:itemBackground="@drawable/navigation_rail_item_background"
    app:selectedBackground="@drawable/navigation_rail_item_selected_background"
    app:itemIconTint="@color/navigation_rail_item_icon_tint"
    app:itemTextColor="@color/navigation_rail_item_text_color"
    app:labelVisibilityMode="selected"
    app:menuGravity="center_vertical"
    app:menuOrientation="vertical"/>

其中，@menu/navigation_menu 表示菜单项的布局文件，navigation_rail_background_color 是导航栏的背景色，navigation_rail_item_background 是菜单项的背景样式，navigation_rail_item_selected_background 是选中的菜单项的背景样式，navigation_rail_item_icon_tint 是菜单项图标的颜色，navigation_rail_item_text_color 是菜单项文字的颜色。

菜单文件

我们需要在 res/menu 目录中创建 navigation_menu.xml 文件，并在其中添加以下代码：

<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/navigation_home"
        android:icon="@drawable/ic_home"
        android:title="@string/navigation_home_title" />
    <item
        android:id="@+id/navigation_dashboard"
        android:icon="@drawable/ic_dashboard"
        android:title="@string/navigation_dashboard_title" />
    <item
        android:id="@+id/navigation_notifications"
        android:icon="@drawable/ic_notifications"
        android:title="@string/navigation_notifications_title" />
</menu>

其中，每个 item 表示一个菜单项，id 是唯一标识，icon 是图标，title 是文字。

设置导航栏监听器

我们需要在 Java 代码中为导航栏设置监听器，实现点击菜单项时切换页面的功能：

navigationRail.setOnItemSelectedListener(new NavigationRail.OnItemSelectedListener() {  
    @Override  
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {  
        switch (item.getItemId()) {  
            case R.id.navigation_home:  
                // 处理点击首页菜单项的逻辑  
                return true;  
            case R.id.navigation_dashboard:  
                // 处理点击仪表盘菜单项的逻辑  
                return true;  
            case R.id.navigation_notifications:  
                // 处理点击通知菜单项的逻辑  
                return true;  
        }  
        return false;  
    }  
});

其中，onNavigationItemSelected() 方法会在点击菜单项时被调用，我们需要根据 id 区分不同的菜单项，并执行相应的逻辑，在执行完逻辑后需要返回 true，表示已经处理完毕。如果返回 false，则导航栏不会执行任何操作。

修改菜单项的样式

我们可以通过修改 NavigationRail 控件和 MenuItem 的样式来达到更好的视觉效果。例如，可以设置 MenuItem 的 iconTint 和 textColor 属性来调整菜单项的颜色；可以设置 NavigationRail 的 backgroundTint 和 selectedBackground 属性来调整导航栏的背景色和选中项的背景色。

结论

通过对 NavigationRail 控件和 MenuItem 样式的修改，我们可以方便地实现 Material Navigation Rail 的自定义。在实际开发中，我们可以根据不同的需求进行调整，以达到最佳的用户体验效果。