Flutter中MaterialApp设置Scaffold背景色出现混合异常问题求助

我在Flutter应用开发中遇到背景色显示异常的问题：已在MaterialApp的ThemeData里将scaffoldBackgroundColor设为Color(0xFF0E1324)，但实际显示的是混合后的颜色，并非预期的目标色。

相关代码 #

MaterialApp(
  debugShowCheckedModeBanner: false,
  theme: ThemeData(scaffoldBackgroundColor: Color(0xFF0E1324)),
  initialRoute: SplashScreen.id,
  routes: {
    SplashScreen.id: (context) => SplashScreen(),
  },
);

颜色对比 #

预期颜色：

实际混合颜色：

排查方向及解决办法 #

• 检查SplashScreen局部配置：如果SplashScreen页面内的Scaffold自己设置了backgroundColor，或者嵌套了带背景色的Container等组件，会直接覆盖全局主题的设置。查看SplashScreen代码，移除局部背景色配置即可。
• 关闭Material3兼容：若你的Flutter版本默认启用了Material3，ThemeData的部分属性行为会变化。可以显式关闭Material3测试：

  ThemeData(
    useMaterial3: false,
    scaffoldBackgroundColor: Color(0xFF0E1324),
  )
  

• 排查透明/混合效果：如果页面内存在Opacity组件、半透明元素，或者自定义绘制中使用了BlendMode，会导致背景色被混合。检查页面中的透明相关代码并调整。
• 验证颜色值准确性：用在线取色器确认0xFF0E1324是否与预期颜色一致，也可以直接在SplashScreen的Scaffold中硬编码该颜色值，测试是否能正常显示。
• 检查主题继承冲突：若SplashScreen被Theme组件局部包裹，局部主题会覆盖全局MaterialApp的主题配置。排查页面是否存在嵌套的Theme组件。

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