flutter 管理 icon 方法

2025-08-20  本文已影响0人  tom__zhu

管理 iOS 和 AOS 的 icon 的便捷方法,用 flutter_launcher_icon 插件

步骤

  1. pubspec.yaml中 引入 flutter_launcher_icons
    dev_dependencies 中加入 flutter_launcher_icons: ^0.14.4(不要用这个版本,用最新版本)
  2. 加 flutter_launcher_icons 配置
    和 dev_dependencies 平级,加 dev_dependencies 配置
flutter_launcher_icons:
  android: true (true表示需要生成安卓icon)
  ios: true (true表示需要生成iOS icon)
  image_path: "assets/icon/icon-1024.png" (1024尺寸的高清图标)
  1. 生成图标
    运行 dart run flutter_launcher_icons 生成各个平台的 icons

原理

flutter_launcher_icons 根据 pubspec.yaml 的配置生成各个平台的图标以及配置json文件,并替换了 flutter create [name] 生成的默认图标

其核心原理可以分为以下几个步骤:

  1. 读取配置:
    当运行 dart run flutter_launcher_icons 命令时,插件首先会去项目的根目录下寻找 pubspec.yaml 文件。
    它会解析该文件中名为 flutter_launcher_icons 的配置节,获取所有必要的参数,例如:
    image_path: 你的高质量原始图标路径。
    ios, android: 确定要为哪些平台生成图标。
    adaptive_icon_background, adaptive_icon_foreground: Android自适应图标的特定配置。
  2. 图片处理与缩放:
    插件会使用内置的图像处理库(通常是基于Dart的 image 库)加载你在 image_path 中指定的高分辨率图标文件。
    根据不同平台(iOS/Android)和不同设备(手机、平板、不同屏幕密度)的官方图标尺寸规范,插件会在内存中生成一系列不同尺寸的图标副本。例如,它知道iOS需要 20x20@2x, 29x29@3x, 60x60@2x, 60x60@3x 等等一系列尺寸的图标,Android需要 mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi 等不同密度目录下的图标。
  3. 文件放置与替换:
    这是最关键的一步。插件知道原生iOS和Android项目中存放应用图标的确切目录结构。
    对于iOS,它会将生成的各种尺寸的 .png 文件放置在 ios/Runner/Assets.xcassets/AppIcon.appiconset/ 目录下,并更新该目录下的 Contents.json 文件,以告知Xcode每个图片文件对应的尺寸和用途。
    对于Android,它会将生成的图标文件放置在 android/app/src/main/res/ 目录下的各个 mipmap-* 文件夹中(例如 mipmap-mdpi, mipmap-hdpi 等)。如果是自适应图标,它还会创建 drawable 资源和XML文件。
  4. 自动化覆盖:
    在放置新文件的过程中,插件会直接覆盖掉由 flutter create 命令生成的默认Flutter图标文件。你无需手动删除任何旧文件。
上一篇 下一篇

猜你喜欢

热点阅读