flutter_native_splash 在 Flutter 中的使用

flutter_native_splash 在 Flutter 中的使用

flutter_native_splash 是一个 Flutter 插件，用于自定义 Flutter 应用的原生启动屏幕。通过设置背景颜色和启动屏幕图像，你可以替换默认的白色原生启动屏幕。该插件还支持暗模式、全屏模式等功能。

安装

首先，在你的 Flutter 项目中，添加 flutter_native_splash 依赖到 pubspec.yaml 文件中：

dependencies:
  flutter:
    sdk: flutter
  flutter_native_splash: ^x.y.z  # 请将 x.y.z 替换为最新版本号

然后，运行以下命令来安装依赖：

flutter pub get

配置

在项目的根目录下，创建一个名为 native_splash.xml（针对 Android）和 LaunchScreen.storyboard（针对 iOS）的配置文件，或者在 pubspec.yaml 文件中直接配置启动屏幕参数。以下是在 pubspec.yaml 文件中的配置示例：

flutter:
  # 其他配置...
  plugins:
    - flutter_native_splash:
        color: "#ffffff"  # 背景颜色
        image: assets/splash.png  # 启动屏幕图像路径
        dark_mode_color: "#000000"  # 暗模式下的背景颜色（可选）
        fullscreen: true  # 是否全屏显示（可选）

确保你已经在 assets 文件夹中放置了 splash.png 图像文件。

应用配置

1. Android：

   插件会自动生成必要的 Android 配置，因此你通常不需要手动修改任何 Android 特定的文件。

2. iOS：

   对于 iOS，你可能需要执行一些额外的步骤来确保启动屏幕正确显示。插件通常会处理大部分工作，但如果你遇到任何问题，可以检查并修改 Runner/Info.plist 和 Runner/Base.lproj/LaunchScreen.storyboard 文件。

完整代码案例

以下是一个完整的 Flutter 项目示例，展示了如何使用 flutter_native_splash：

# pubspec.yaml
name: my_flutter_app
description: A new Flutter application.

# The following line prevents the package from being published to
# pub.dev. Remove it if you wish to publish this package.
publish_to: 'none'

# The following defines the version and build number for your application.
# A version number is three numbers separated by dots, like 1.2.34.
# The build number is used only for iOS and Android.
version: 1.0.0+1

environment:
  sdk: ">=2.12.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter
  flutter_native_splash: ^x.y.z  # 请将 x.y.z 替换为最新版本号

# For information on asset bundles, see
# https://flutter.dev/assets-and-images/#asset-bundles
assets:
  - assets/splash.png

flutter:
  # 其他配置...
  plugins:
    - flutter_native_splash:
        color: "#ffffff"
        image: assets/splash.png
        dark_mode_color: "#000000"
        fullscreen: true

# 以下是其他常见的 Flutter 配置...

在 assets 文件夹中放置一个名为 splash.png 的图像文件。

然后，运行以下命令来生成并应用启动屏幕配置：

flutter pub get
flutter pub run flutter_native_splash:generate

运行应用后，你应该会看到自定义的启动屏幕。

注意事项

• 确保 splash.png 图像的分辨率适合你的目标设备。
• 如果在 iOS 上遇到问题，请检查 Runner/Info.plist 和 Runner/Base.lproj/LaunchScreen.storyboard 文件是否正确配置。
• 插件版本可能会更新，请查看最新的文档以获取最新的配置选项和说明。