Flutter 启动画面

启动画面是启动屏幕、开始屏幕或引导屏幕，它是一种图形控制元素，包含软件的图像、徽标和当前版本。 它是应用程序加载时显示的应用程序的第一个屏幕。它也可以是应用程序的欢迎屏幕，在移动游戏或程序启动时提供一个简单的初始体验。 启动画面只是一个显示屏幕，允许用户在硬件加载以向用户呈现软件时查看某些内容。

启动画面的常见元素包含公司名称和徽标或标题。启动画面的最常见示例是在启动 Flutter 应用程序时显示的 Flutter 徽标，或者在启动 Microsoft 操作系统时显示的 Microsoft 徽标。在本教程中，我们将了解如何在 Flutter 应用程序中创建启动画面。

启动画面特性

以下是启动画面的基本特征

• 它主要用于应用程序的品牌推广或身份识别，并将品牌印象传递给用户。
• 它也可以用于在硬件加载以向用户呈现软件时显示一些加载进度指示器。
• 当启动画面加载完成后，用户会获得另一个功能屏幕，该屏幕将是主屏幕或仪表板，然后就被遗忘了。一旦加载完成，我们就无法按后退按钮返回到启动画面。

在这里，我们将解释两种在应用程序中添加启动画面的方法。

方法 1： 在第一种方法中，我们将实现 Timer() 函数来在我们的应用程序中创建一个启动画面。

首先，在您正在使用的 IDE 中创建一个新项目。 打开项目，导航到 lib 文件夹，并将以下代码替换为 main.dart 文件。

在上面的代码中，我们有一个方法 initState()，当有状态 widget 被插入 widget 树中时调用一次。 此方法首先调用 super.initState()，然后调用 Timer 函数。 timer 函数包含两个参数，第一个是 duration，第二个是 要执行的操作。 我们已将持续时间指定为五秒钟，并且在完成时间后，当前屏幕将被应用程序的主屏幕（即 HomeScreen()）替换。

输出

当我们打开应用程序时，我们将首先看到 Flutter 徽标 5 秒钟，如下面的屏幕截图所示。

完成 5 秒后，它将显示我们应用程序的主屏幕，如下面的屏幕截图所示。

方法 2： 在第二种方法中，我们将使用 splashscreen 包来在我们的应用程序中创建一个启动画面。 此包提供了许多属性，如下所示

首先，在您正在使用的 IDE 中创建一个新项目。 打开项目，导航到 lib 文件夹，然后打开 pubspec.yaml 文件，我们需要在其中添加如下所示的 splashscreen 依赖项

现在，打开 main.dart 文件并将其替换为以下代码。

在上面的代码中，我们有一个主页作为 SplashScreenPage()，它将返回 SplashScreen 类。 此类具有多个用于显示启动画面的属性，例如 title、image、backgroundcolor、gradientBackground、seconds、loadingText 等。 second 属性用于启动画面向用户显示的时间，完成之后，它将导航到新屏幕，即我们应用程序中的 HomeScreen()。

输出

当我们打开应用程序时，我们将首先看到图像和加载图标 5 秒钟，如下面的屏幕截图所示。 当指定时间完成后，我们将导航到应用程序的主页。