如何在 Flutter 应用中创建启动屏幕答案

【问题标题】：How to create a launch screen in Flutter app如何在 Flutter 应用中创建启动屏幕
【发布时间】：2020-09-06 14:14:35
【问题描述】：

我正在 Flutter 中创建一个应用程序，我想创建一个启动屏幕，该屏幕会在应用程序首次启动时显示。首次打开应用程序时，会短暂显示白屏，这意味着 Android 中有一些进程需要在应用程序启动之前完成。我想用我自己的屏幕替换那个白屏。

我不打算制作启动应用程序后将显示的启动屏幕，而是在应用程序加载/启动时显示启动屏幕。

最简单的方法是什么？

我还想说，我已经在互联网上寻找答案，其中大多数都提供添加一个启动屏幕，该屏幕会在应用程序初始化后显示。我不是在寻找那个。感谢您的帮助！

【问题讨论】：

这是 git hub 链接，在该链接中加载微调器会显示初始屏幕 [github.com/shahryar-cmyk/thrive] 如果您正在搜索
不，这样我添加的是启动屏幕，而不是加载屏幕。

标签： android flutter dart screen loading

【解决方案1】：

您可以在应用中使用闪屏小部件。

1.在您的pubspec.yaml 文件中获取启动画面。检查一下 Flutter packages link.

2.在您的项目中导入启动画面
import 'package:splashscreen/splashscreen.dart';

3.创建有状态或无状态小部件。

返回以下代码：

return MaterialApp(
  home: SplashScreen(
    navigateAfterSeconds: MainScreen(),
    seconds: 3,
    backgroundColor: Colors.white12,
    image: Image.asset('Location of the gif or image to be displayed'),
    loaderColor: Colors.redAccent,
    photoSize: 159,
  ),
);

查看Rapto Learning上的更多教程。

【讨论】：

我试过了，但是这是在应用程序初始化后添加启动画面，应用程序初始化时仍然出现白屏。我想用我自己的屏幕替换那个白屏。这并没有解决我的问题。不过谢谢！
你可以多次调用一个类闪屏。希望对你有用
不幸的是，我不想创建启动画面。我想创建一个启动屏幕，请阅读我上面的问题。您可以查看此链接以了解启动屏幕和启动屏幕之间的区别：stackoverflow.com/questions/12140464/…

【解决方案2】：

在.android > app > src\main > res 中有一个drawable 和一个或多个mipmap 文件夹。这些mipmap 文件夹包含不同设备尺寸的图像。将您的图像资产放在那里。现在看看drawable > launch_background.xml。您可以在下图中看到文件的外观。取消注释第 7-11 行和/或将第 4 行更改为另一种颜色，现在您已经自定义了 Flutter 应用程序的默认启动屏幕。现在，如果您启动应用程序，使用上面的示例，您的启动屏幕应该如下所示这个：

【讨论】：

【解决方案3】：

嗯，首先你需要使用一个 RootPage。这将显示 loadingPage，然后是 HomePage（或您需要的任何页面）。您只需要使 RootPage 有状态（以便更改页面设置新状态）。

没有独特的方法。因此，我不会在这里编写代码。我将解释结构。

loadingPage 显示您想要的内容（您可以使用 Animated 小部件使其具有动画效果）

Rootpage 将显示 LoadingPage，您可以使用 Timer dart 类更改 rootpage 的状态以显示 Homepage。另一种方法是在动画完成时从加载页面获取回调。

这是我认为不使用其他管理系统（如 bloc 库）的最简单方法之一

【讨论】：

很抱歉，在初始化应用程序时仍然显示白屏。应用程序初始化后会显示 loadingPage，这不是我想要的。看看这个，你就知道我在找什么：stackoverflow.com/questions/12140464/…