flutter 配置 安卓、Ios启动图

android 配置启动图

launch_background.xml

复制代码
<?xml version="1.0" encoding="utf-8"?>
<!-- Modify this file to customize your launch splash screen -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="?android:colorBackground" />
<item>
        <bitmap
           android:gravity="fill"
            android:src="@mipmap/launch" />
    </item>
    <!-- You can insert your own image assets here -->
    <!-- <item>
        <bitmap
            android:gravity="fill"
            android:src="@mipmap/launch_image" />
    </item> -->
</layer-list>

注意:这里在drawable和drawable-v21目录中的两个文件都需要更换android:gravity="fill" 就是铺满,android:gravity="center",图片居中,通常用于 logo + 纯色背景

AndroidManifest.xml

android:theme="@style/LaunchTheme" 如下图添加位置

复制代码
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
 <!-- 这里必须设置 -->
    <application
        android:label="storeapp"
        android:name="${applicationName}"
        android:icon="@mipmap/ic_launcher">
        <activity
            android:name=".MainActivity"
            android:exported="true"
            android:launchMode="singleTop"
            android:taskAffinity=""
             android:theme="@style/LaunchTheme" 
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
            android:hardwareAccelerated="true"
            android:windowSoftInputMode="adjustResize">

mipmap-mdpi

这几个文件内部吧launch.png图片放进去

  • 重新运行就可以了

iOS 启动页配置

iOS的启动页通常是Storyboard文件:ios/Runner/Base.lproj/LaunchScreen.storyboard

步骤

  1. 打开 ios/Runner.xcworkspace(Xcode工程)
  2. 到 LaunchScreen.storyboard 文件
  3. 你可以在Storyboard里编辑启动页的布局、图片和背景颜色
  4. 启动页的颜色也可以在 Info.plist 的 UILaunchStoryboardName 项确认为 LaunchScreen

推荐自动化方案 你也可以用Flutter插件

  • 你也可以用Flutter插件 flutter_native_splash 来自动帮你生成配置启动页。

使用示例

复制代码
安装插件
dev_dependencies:
  flutter_native_splash: ^2.2.10

yaml配置

复制代码
flutter_native_splash:
  color: "#ffffff"  # 启动页背景色(可根据图片底色自定义)
  image: assets/launch.png  # 一整张图的路径
  android: true
  ios: true
  fullscreen: true  # 推荐设置为 true,一整张图全屏展示


解构
your_project/
├── assets/
│   └── launch.png   ← 一整张启动图

在 pubspec.yaml 中声明图片资源

复制代码
flutter:
  assets:
    - assets/launch.png

运行

复制代码
flutter pub run flutter_native_splash:create
相关推荐
千里马学框架4 天前
一起学 Android 14:ShellTransition 屏幕旋转过程深度剖析
android·智能手机·性能优化·framework·性能·屏幕旋转·rotation
美狐美颜SDK开放平台4 天前
开发直播APP时如何接入视频美颜SDK?开发流程与注意事项
android·人工智能·计算机视觉·音视频·直播美颜sdk
AFinalStone4 天前
Android7 SystemUI源码解析(七)Keyguard锁屏模块深度解析
android·systemui
致远ccc5 天前
Google Play 上架前如何测试 App?多国家 Android 环境测试
android·app测试·googleplay·多国家应用测试
ttyyttemo5 天前
Kotlin 协程中的 Job 结构化并发与取消
android
sun0077005 天前
tbox 4g/5g切换,导致wan ip 改变,导致车机旧网络不可用。需要重启车机才行
android
其实防守也摸鱼5 天前
内网穿透与反向代理:原理、工具与实战指南
android·大数据·运维·安全·网络安全·自动化·渗透
茶底世界之下5 天前
为什么预览、录制、离线导出不能共享同一个背压策略?
ios·swift
AFinalStone5 天前
Android7 SystemUI 源码解析(四)NavigationBar 导航栏与 SystemBars
android·systemui
JMchen5 天前
属性动画原理与高级动画实现
android·kotlin·canvas