如何为Flutter应用制作带不同图片的启动页？

首先得明确：系统级的启动闪屏（就是点开APP后第一个出现的画面，还没进入Flutter框架）是由Android/iOS原生配置控制的，纯Flutter没法直接修改这部分。你既然已经有Python脚本能根据不同MainPage切换应用图标，完全可以复用这个逻辑，同步搞定启动页的切换。

具体操作步骤 #

1. 先准备对应启动页资源 #

把每个MainPage对应的启动页图片，按Android/iOS的规范整理好，和应用图标放在同个原生资源目录：

• Android：放到android/app/src/main/res/drawable-xxx系列目录里，对应不同屏幕分辨率
• iOS：放到ios/Runner/Assets.xcassets下的LaunchImage.asset目录里

2. 用现有Python脚本同步修改启动页 #

在你生成应用图标的Python脚本里，加一段逻辑，同步替换原生启动页的资源或配置：

Android端

两种方式可选：

• 修改XML配置：打开android/app/src/main/res/drawable/launch_background.xml，找到里面的ImageView标签，把它的android:src属性改成对应MainPage的图片资源名。
  示例Python代码片段：

  def update_android_splash(main_page):
      xml_path = "android/app/src/main/res/drawable/launch_background.xml"
      with open(xml_path, "r") as f:
          content = f.read()
      # 替换默认的启动图引用
      content = content.replace("@drawable/launch_default", f"@drawable/launch_{main_page}")
      with open(xml_path, "w") as f:
          f.write(content)
  

• 直接替换图片文件：把对应分辨率的启动页图片，覆盖到Android的drawable目录里的默认启动图文件。比如用shutil复制文件：

  import shutil
  
  def replace_android_splash_images(main_page):
      src_base = f"native_resources/splash/{main_page}/"
      dest_dirs = [
          "android/app/src/main/res/drawable-mdpi/",
          "android/app/src/main/res/drawable-hdpi/",
          "android/app/src/main/res/drawable-xhdpi/",
          # 按需添加其他分辨率目录
      ]
      for dest_dir in dest_dirs:
          shutil.copy(f"{src_base}launch.png", f"{dest_dir}launch.png")
  

iOS端

同样两种方式：

• 修改ios/Runner/Assets.xcassets/LaunchImage.asset/Contents.json里的图片文件名，替换成对应MainPage的图片；
• 直接把对应尺寸的启动页图片，覆盖LaunchImage.asset目录里的默认图片文件。

3. 纯Flutter过渡页（备选方案） #

如果你不想碰原生配置，只需要进入Flutter框架后的过渡页和图标一致，可以纯用Flutter实现：在main()方法里先显示对应MainPage的启动图，延迟几秒再跳转到目标页面。
示例代码：

void main() {
  // 这里获取当前要启动的页面标识，和你切换图标的逻辑一致
  String targetPage = getTargetMainPage();
  runApp(MyApp(targetPage: targetPage));
}

class MyApp extends StatelessWidget {
  final String targetPage;
  const MyApp({super.key, required this.targetPage});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: SplashPage(targetPage: targetPage));
  }
}

class SplashPage extends StatefulWidget {
  final String targetPage;
  const SplashPage({super.key, required this.targetPage});

  @override
  State<SplashPage> createState() => _SplashPageState();
}

class _SplashPageState extends State<SplashPage> {
  @override
  void initState() {
    super.initState();
    // 延迟2秒跳转到目标页面
    Future.delayed(const Duration(seconds: 2), () {
      switch(widget.targetPage) {
        case "pageA":
          Navigator.pushReplacement(context, MaterialPageRoute(builder: (_) => MainPageA()));
          break;
        case "pageB":
          Navigator.pushReplacement(context, MaterialPageRoute(builder: (_) => MainPageB()));
          break;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    String splashImg;
    switch(widget.targetPage) {
      case "pageA":
        splashImg = "assets/splash/page_a.png";
        break;
      case "pageB":
        splashImg = "assets/splash/page_b.png";
        break;
      default:
        splashImg = "assets/splash/default.png";
    }
    return Scaffold(body: Center(child: Image.asset(splashImg)));
  }
}

注意：这个方案是Flutter加载完成后的过渡页，启动初期还是会显示原生默认闪屏，体验不如原生闪屏流畅，适合快速测试的场景。

总结 #

• 要实现和图标完全同步的系统级启动闪屏：必须修改Android/iOS原生配置，结合你现有的Python脚本自动替换资源或XML，这是最靠谱的方式；
• 只是要Flutter内部的过渡页：纯Flutter就能搞定，但没法替换系统启动初期的画面。

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