使用flutter_native_splash时启动页图标像素化模糊问题排查

问题成因分析 #

结合你的配置和已排查项，问题主要来自以下几点：

• Android 12+自适应图标规范未满足：Android 12及以上的启动页采用自适应图标机制，要求前景图标预留安全边距（不能占满画布），你直接复用普通logo图片，系统自动缩放时会丢失细节导致模糊。
• Android 12配置逻辑误用：android_12节点需要的是符合自适应规范的前景图标，而非完整的应用logo，直接复用普通图会触发不合理的缩放逻辑。

修复步骤 #

1. 制作符合规范的自适应前景图标 #

Android 12+自适应图标要求：

• 画布尺寸：108x108dp（对应xxxhdpi分辨率为432x432px，xxhdpi为324x324px）
• 前景图标需放在中间72x72dp范围内，四周留18dp透明边距，避免被系统裁剪或缩放
• 保存为带透明通道的PNG格式，命名如logo_foreground.png

2. 修改pubspec.yaml配置 #

调整android_12节点，使用专门的前景图标：

flutter_native_splash:
  color: "#EBDBD0"
  image: assets/images/logo.png
  android: true
  ios: false

  android_12:
    icon_background_color: "#EBDBD0"
    image: assets/images/logo_foreground.png
    icon_background_color_dark: "#EBDBD0"
    image_dark: assets/images/logo_foreground.png

3. 重新生成启动页资源 #

执行命令重新构建启动页文件：

flutter pub run flutter_native_splash:create

4. 清理缓存并验证 #

• 卸载设备上的旧应用，重新编译安装
• 可选：执行flutter clean清理Flutter缓存后再构建

额外注意事项 #

• 若需兼容Android 11及以下，主节点的image可保留原logo，但建议提供多分辨率资源（放入mipmap-xxxhdpi、mipmap-xxhdpi等目录），进一步优化缩放效果
• 确保前景图标线条、文字足够粗壮，避免细元素在缩放后模糊

内容的提问来源于stack exchange，提问作者Moahemd Abdelkhalel