React Native Expo 安卓暗黑模式导致应用背景色自动变黑问题求助

方案1：全局禁用深色模式适配（最简便） #

直接修改Expo配置即可，无需操作原生文件夹：

• 打开项目根目录的app.json（或app.config.js/app.config.ts）
• 在expo配置节点下添加如下字段：

{
  "expo": {
    // 保留其他原有配置
    "userInterfaceStyle": "light",
    // 不需要单独区分端配置的话可以省略下面两个端级配置
    "android": {
      "userInterfaceStyle": "light"
    },
    "ios": {
      "userInterfaceStyle": "light"
    }
  }
}

• 配置修改后重启Expo服务，启动时添加清除缓存参数：npx expo start --clear
  如果使用的是自定义开发客户端/生产构建，需要重新执行构建操作后配置才会生效。

方案2：仅固定根背景颜色（保留系统深色模式适配能力） #

如果不需要完全禁用深色模式，只要求背景固定为白色，做以下修改即可：

1. 根组件外层容器强制设置白色背景
   在入口组件（通常为App.js/tsx）的最外层View添加样式：

import { View, StatusBar } from 'react-native';

export default function App() {
  return (
    <View style={{flex: 1, backgroundColor: '#fff'}}>
      {/* 同步调整状态栏文字为深色，避免亮色背景下看不清状态栏内容 */}
      <StatusBar barStyle="dark-content" backgroundColor="#fff" />
      {/* 其余业务代码 */}
    </View>
  )
}

2. 如果你使用了React Navigation，需要同步修改导航容器的主题色：

import { NavigationContainer, DefaultTheme } from '@react-navigation/native';

const CustomTheme = {
  ...DefaultTheme,
  colors: {
    ...DefaultTheme.colors,
    background: '#fff'
  },
};

export default function App() {
  return (
    <NavigationContainer theme={CustomTheme}>
      {/* 导航配置代码 */}
    </NavigationContainer>
  );
}

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