启动页(闪屏页)

向 Android 应用添加启动页(闪屏页)

平台集成

chevron_right

Android

chevron_right

启动页(闪屏页)

概览

#

闪屏页(也称为启动页)是你的应用在启动时给用户的第一印象。它就像是你的应用的基础,同时允许你在它展示的时间里,加载你的引擎和初始化你的应用。本指南将展示如何在 Flutter 编写的移动应用中恰当地使用闪屏页。

你有以下几种方案来实现启动页:

你可以使用 pub.dev 上的 package。

你可以手动实现它,例如 闪屏页示例应用。本篇其余内容均基于手动实现。

初始化应用

#

所有 Android 应用在操作系统准备应用进程时都需要一定的初始化时间。因此 Android 提供了 启动界面 的概念,在应用初始化的时候显示 Drawable。

info

提示

对于集成了多个 Flutter 内容的 Android 应用,可以考虑

预热 FlutterEngine

以及在整个应用中复用同一个 Flutter 引擎,以减少初始化的等待时间。

Drawable 是一种 Android 图形图像处理。要了解如何在 Android Studio 中为 Flutter 添加 Drawable,请查阅 Android 开发者文档:将可绘制对象导入项目中

默认的 Flutter 项目模板定义了启动主题和启动背景。你可以在 styles.xml 中自定义一个主题,将一个 Drawable 配置给该主题的 windowBackground,它将作为启动页被展示。

xml此外,在 styles.xml 中定义一个 普通主题,当启动页消失后,它会应用在 FlutterActivity 上。普通主题的背景仅仅展示非常短暂的时间,例如,当启动页消失后、设备方向改变或者 Activity 恢复期间。因此建议普通主题的背景颜色使用与 Flutter UI 主要背景颜色相似的纯色。

xml

在 AndroidManifest.xml 中配置 FlutterActivity

#

在 AndroidManifest.xml 中,将 FlutterActivity 的 theme 设置为启动主题,将元数据元素添加到所需的 FlutterActivity,以知会 Flutter 在适当的时机从启动主题切换到普通主题。

xml

android:name=".MyActivity"

android:theme="@style/LaunchTheme"

// ...

>

android:name="io.flutter.embedding.android.NormalTheme"

android:resource="@style/NormalTheme"

/>

如此一来,Android 应用程序就会在在初始化时展示对应的启动页面。

闪屏 (SplashScreen) API

#

从 Android 12 开始引入了 SplashScreen API。在你的 styles.xml 文件中使用 SplashScreen API。例如:

xml

info

提示

如果你的 Android 应用 同时 支持 Android 12 之前以及之后的版本,请考虑在 styles.xml 文件中使用两套不同的资源。此外,请确保你的背景图像符合图标指南。查看文档 Android 闪屏页面 来了解更多。

某些应用可能希望在 Flutter 中继续显示 Android 闪屏页的最后一帧。例如,保持一帧的展示,同时 Dart 继续加载其他内容。想达到这样的效果,以下 API 可能有帮助:

Kotlin

Java

MainActivity.ktkotlinimport android.os.Build

import android.os.Bundle

import androidx.core.view.WindowCompat

import io.flutter.embedding.android.FlutterActivity

class MainActivity : FlutterActivity() {

override fun onCreate(savedInstanceState: Bundle?) {

// Aligns the Flutter view vertically with the window.

WindowCompat.setDecorFitsSystemWindows(getWindow(), false)

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {

// Disable the Android splash screen fade out animation to avoid

// a flicker before the similar frame is drawn in Flutter.

splashScreen.setOnExitAnimationListener { splashScreenView -> splashScreenView.remove() }

}

super.onCreate(savedInstanceState)

}

}

MainActivity.javajavaimport android.os.Build;

import android.os.Bundle;

import android.window.SplashScreenView;

import androidx.core.view.WindowCompat;

import io.flutter.embedding.android.FlutterActivity;

public class MainActivity extends FlutterActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

// Aligns the Flutter view vertically with the window.

WindowCompat.setDecorFitsSystemWindows(getWindow(), false);

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {

// Disable the Android splash screen fade out animation to avoid

// a flicker before the similar frame is drawn in Flutter.

getSplashScreen()

.setOnExitAnimationListener(

(SplashScreenView splashScreenView) -> {

splashScreenView.remove();

});

}

super.onCreate(savedInstanceState);

}

}

然后你可以重新实现 Flutter 的第一帧,将元素摆放在与 Android 闪屏页相同的位置。关于这个的示例,请参考 闪屏页示例应用。

本页内容对你有帮助吗?

thumb_up

thumb_down

感谢你的反馈!

feedback

提供详细信息

感谢你的反馈!欢迎告诉我们该如何改进。

bug_report

提供详细信息

除非另有说明,本文档之所提及适用于 Flutter 的最新稳定版本,本页面最后更新时间: 2025-10-09。

查看文档源码

或者

为本页面内容提出建议.