C# Xamarin 如何修改底部导航栏颜色以匹配应用主题

以下分为系统底部导航栏、**应用内底部标签导航栏（BottomNavigationView）**两种场景给出操作步骤： #

一、系统底部导航栏（安卓系统全局操作栏，包含返回/首页/多任务按钮） #

1. 生效范围选择 #

• 全局生效：修改res/values/styles.xml（深色模式适配修改res/values-night/styles.xml）
• 单页面生效：修改对应Activity的onCreate方法代码

2. 具体操作 #

全局生效配置

在应用的主题节点中添加如下属性：

<!-- 底部导航栏背景色，替换为你的主题色 -->
<item name="android:navigationBarColor">@color/your_theme_color</item>
<!-- 可选：导航栏颜色偏浅时，将按钮改为深色显示，仅安卓8.0+支持 -->
<item name="android:windowLightNavigationBar">true</item>

单页面生效配置

在Activity的setContentView后添加代码：
Kotlin示例：

window.navigationBarColor = ContextCompat.getColor(this, R.color.your_theme_color)
// 浅色导航栏配深色按钮
window.decorView.systemUiVisibility = View.SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR

Java示例：

getWindow().setNavigationBarColor(ContextCompat.getColor(this, R.color.your_theme_color));
// 浅色导航栏配深色按钮
getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR);

注意：navigationBarColor仅在安卓5.0（API21）及以上版本生效，低版本会自动忽略该配置不报错。

二、应用内底部标签导航栏（BottomNavigationView，应用自己实现的页签切换栏） #

1. 生效范围选择 #

• 固定配置：修改对应页面的XML布局文件
• 动态切换：在页面代码中调用方法修改

2. 具体操作 #

XML固定配置

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_nav"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/your_theme_color" <!-- 导航栏背景色 -->
    app:itemIconTint="@color/bottom_nav_item_selector" <!-- 图标选中/未选中颜色 -->
    app:itemTextColor="@color/bottom_nav_item_selector" <!-- 文字选中/未选中颜色 -->
    app:menu="@menu/bottom_nav_menu" />

代码动态修改

val bottomNav = findViewById<BottomNavigationView>(R.id.bottom_nav)
// 修改背景色
bottomNav.setBackgroundColor(ContextCompat.getColor(this, R.color.your_theme_color))
// 修改图标文字颜色
bottomNav.itemIconTintList = ContextCompat.getColorStateList(this, R.color.bottom_nav_item_selector)
bottomNav.itemTextColor = ContextCompat.getColorStateList(this, R.color.bottom_nav_item_selector)

三、Jetpack Compose场景修改系统导航栏 #

使用Accompanist系统UI控制器组件实现：

val systemUiController = rememberSystemUiController()
val isDarkTheme = isSystemInDarkTheme()

SideEffect {
    systemUiController.setNavigationBarColor(
        color = MaterialTheme.colorScheme.primary, // 替换为你的主题色
        darkIcons = !isDarkTheme
    )
}

内容的提问来源于stack exchange，提问作者FHJTDSDG