跳到主要内容

flutter_native_splash启动页图片尺寸与规范

Flutter Native Splash 启动页图片尺寸与规范笔记​

分类建议图片总尺寸Logo 实际占比（宽度）说明与适用场景备注
✅ 推荐标准（无背景图标）1152 × 1152 pxLogo 占总宽度约 25%～35%（约 288～400px）官方推荐的高清标准，适配大多数机型，保持高分辨率透明背景 PNG 效果最佳
✅ 常用实战方案960 × 960 pxLogo 宽度约 250～350px最常用配置，视觉平衡、加载速度快四周预留足够留白
⚖️ 轻量方案（中等分辨率）720 × 720 pxLogo 宽度约 200～250px用于 App 体积优化或简单启动页清晰度略低于 960px
🧱 含背景圆形图标960 × 960 px图标主体应位于 640px 直径圆形 内对应 Android 启动图标比例背景可为 App 主色
⚠️ 不推荐小于 512 × 512 px-会导致模糊、失真仅调试或测试使用

🎯 视觉规范建议​

  1. 居中显示：
    插件默认居中，但建议在配置文件中显式声明：

    android_gravity: center ios_content_mode: center

  2. 图标内容：

    • 保持主体对称，避免靠边。
    • 预留约 20–30% 的透明留白边距。
    • 若为圆形或方形 Logo，确保整体在视觉中心。

  3. 格式与颜色：

    • 首选格式：PNG（支持透明背景）
    • 背景色：与启动页 color 一致或对比清晰。
    • 避免复杂渐变：简洁纯色更专业。

⚙️ 插件配置模板​

futter_native_splash:
  color: "#FFFFFF"                # 背景颜色
  image: assets/images/logo.png   # 启动页图片路径
  android: true
  ios: true
  android_gravity: center
  ios_content_mode: center

应用配置后执行：

flutter pub run flutter_native_splash:create

💡 总结一句话​

让启动页 Logo 图片“整体 960px，Logo 实体居中约 300px”，即可获得最自然的居中视觉效果。