准备工作
首先,安装 flutter_launcher_icons 包。在终端中:
flutter pub add flutter_launcher_icons
//或者
dart pub add flutter_launcher_icons
然后运行:
dart run flutter_launcher_icons:generate
这时候在根目录就会出现 flutter_launcher_icons.yaml。
准备图标文件
在开始配置之前,需要准备好以下图标文件(建议都使用 1024×1024 像素的 PNG 格式):
- 基础图标文件
- Android 适配图标的背景层,前景层,单色图标。
- iOS 的普通图标,深色模式,灰阶图标(如果很懒可以直接把安卓的单色图标反色)。
这里需要给谷歌孝子说明一下,单色图标和前景也可以是 png 格式的,不一定像 Android Studio 那样必须是 SVG。此外你也不用导出多个尺寸,只要一张高清图 Flutter 就会自动裁切到 Android 和 iOS 里。
将这些文件放在项目的 assets/icons
目录下(当然你也可以选择其他目录)。
具体的设计指南可以参考:
- 自适应图标 | Android 开发者
- App 图标 | Apple 开发者(我认为深色图标完全可以自己设计,和谐就可以,不用跟着官方的来)
配置文件设置
在项目根目录下创建或修改 flutter_launcher_icons.yaml
文件,添加以下配置:
flutter_launcher_icons:
# 基础图标配置
image_path: "assets/icons/image_path_android.png"
# Android 相关配置
android: "launcher_icon"
image_path_android: "assets/icons/image_path_android.png"
min_sdk_android: 21 # 最低支持的 Android SDK 版本
adaptive_icon_background: "assets/icons/adaptive_icon_background.png"
adaptive_icon_foreground: "assets/icons/adaptive_icon_foreground.png"
adaptive_icon_monochrome: "assets/icons/adaptive_icon_monochrome.png"
# iOS 相关配置
ios: true
image_path_ios: "assets/icons/image_path_ios.png"
remove_alpha_channel_ios: true # 移除 alpha 通道
image_path_ios_dark_transparent: "assets/icons/image_path_ios_dark_transparent.png"
image_path_ios_tinted_grayscale: "assets/icons/image_path_ios_tinted_grayscale.png"
desaturate_tinted_to_grayscale_ios: true
生成图标
配置完成后,只需要运行一条命令就能生成所有平台的图标:
dart run flutter_launcher_icons

RELATED POSTS
View all