使用flutter_native_splash时Flutter启动页状态栏颜色闪烁如何解决

三次闪烁对应三个不同阶段的样式不匹配：系统初始启动窗口、原生启动页、Flutter首屏渲染，对齐三个阶段的状态栏配置即可解决：

1. 对齐Android原生层双主题配置 #

• 打开android/app/src/main/res/values/styles.xml及values-night/styles.xml，确保启动主题和普通App主题的状态栏参数完全一致，不要仅修改单一样式：

<!-- LaunchTheme 启动专用主题 -->
<style name="LaunchTheme" parent="@android:style/Theme.Light.NoTitleBar">
    <item name="android:statusBarColor">@color/primaryColor</item>
    <!-- 状态栏图标亮度，浅色背景配true、深色背景配false，与后续配置统一 -->
    <item name="android:windowLightStatusBar">true</item>
    <!-- 若使用透明状态栏需添加下方配置，避免刘海屏区域闪烁 -->
    <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
</style>

<!-- NormalTheme 应用运行期主题 -->
<style name="NormalTheme" parent="@android:style/Theme.Light.NoTitleBar">
    <item name="android:statusBarColor">@color/primaryColor</item>
    <item name="android:windowLightStatusBar">true</item>
</style>

2. 对齐flutter_native_splash插件配置 #

• 检查pubspec.yaml中插件配置，状态栏参数与原生配置完全一致：

flutter_native_splash:
  color: "#你的启动页背景色"
  android_status_bar_color: "#你的主色十六进制值"
  android_status_bar_icon_brightness: light # 和原生windowLightStatusBar对应
  # 禁用启动页退出过渡动画，避免动画导致的颜色跳变
  android:
    disable_transition_animation: true

• 修改完配置后重新执行生成命令：
  flutter pub run flutter_native_splash:create

3. Flutter层提前初始化状态栏样式 #

• 不要在首屏页面的生命周期中才设置状态栏，在main()函数runApp之前就完成配置，对齐前两步的参数：

import 'package:flutter/services.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: primaryColor, // 你的主色值，和前面配置一致
    statusBarIconBrightness: Brightness.light,
    statusBarBrightness: Brightness.light,
  ));
  runApp(const MyApp());
}

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