Android12+下Expo SDK45应用深色模式通知图标变色问题求助

问题描述 #

基于Expo SDK45开发的应用在Android 12+系统中出现通知图标颜色异常：

• 图标设置为固定蓝色（#192BC2），浅色主题下显示正常
• 深色主题下图标自动变为紫色
• 尝试在color.xml (night)中配置颜色，未生效

应用配置：

minSdkVersion 21
targetSdkVersion 31

图标对比 #

• 浅色主题图标：
• 深色主题图标：

变色机制解析 #

Android 12+ 引入了通知图标自动主题适配逻辑：系统会根据当前主题（浅色/深色），自动调整通知图标颜色以匹配状态栏/通知栏的对比度。具体规则：

1. 对于单色矢量通知图标，系统会提取图标Alpha通道，用系统主题的colorPrimary或colorOnSurface等主题色重新着色
2. Expo SDK45 默认启用了Android 12+的这一自动着色机制，直接设置图标颜色或修改color.xml (night)会被系统覆盖，导致自定义颜色失效

固定颜色的解决方法 #

方法1：通过Expo Notification API强制指定颜色 #

发送通知时，在android配置中开启colorized并指定固定颜色，禁用系统自动着色：

import * as Notifications from 'expo-notifications';

await Notifications.scheduleNotificationAsync({
  content: {
    title: "通知标题",
    body: "通知内容",
    color: "#192BC2" // 强制设置目标蓝色
  },
  trigger: { seconds: 1 },
  android: {
    colorized: true, // 启用自定义颜色着色
    icon: "@mipmap/your_notification_icon" // 替换为你的通知图标资源名
  }
});

方法2：裸工作流下修改Android原生配置 #

如果使用Expo裸工作流，可直接修改Android项目文件：

1. 在android/app/src/main/res/values/colors.xml中定义固定颜色：

<color name="fixed_notification_blue">#192BC2</color>

2. 在AndroidManifest.xml中添加配置，强制使用自定义颜色：

<!-- 设置默认通知图标 -->
<meta-data
    android:name="com.google.firebase.messaging.default_notification_icon"
    android:resource="@mipmap/your_notification_icon" />
<!-- 强制指定通知图标颜色 -->
<meta-data
    android:name="com.google.firebase.messaging.default_notification_color"
    android:resource="@color/fixed_notification_blue" />
<meta-data
    android:name="android.app.notification.icon_color"
    android:value="#192BC2" />

方法3：使用不透明位图图标（不推荐） #

将通知图标改为不透明的PNG位图，系统不会对不透明图标进行自动着色。但该方式不符合Android通知图标设计规范，可能导致部分主题下对比度不足，不建议采用。

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