Flutterで簡単アプリアイコン変更術

2023年3月27日 08:21

flutter_launcher_iconsというパッケージを使うことで、リリースしたアプリのアイコンを簡単に変更できるのでご紹介します！

pubspec.yaml

Flutterプロジェクトのpubspec.yamlで、dependencies:の下にflutter_launcher_icons: ^0.12.0を追加します。

dependencies:
  flutter:
    sdk: flutter
  flutter_launcher_icons: ^0.12.0

ちなみに、pubspec.yamlにはdependencies:とdev_dependencies:という似たものがあり、これらの下にflutter_launcher_icons等のパッケージを追記していきます。
2つの違いとして、dependencies:は自分のFlutterプロジェクトを他者がパッケージとして使用する際に必要となるパッケージで、dev_dependencies:は自分のパッケージの開発段階でのみ必要とされるものだそうです。

Dependencies
Dependencies are the pubspec’s raison d’être. In this section you list each package that your package needs in order to work.
Dependencies fall into one of two types. Regular dependencies are listed under dependencies:—these are packages that anyone using your package will also need. Dependencies that are only needed in the development phase of the package itself are listed under dev_dependencies.
During the development process, you might need to temporarily override a dependency. You can do so using dependency_overrides.

Flutter公式ドキュメント
https://dart.dev/tools/pub/pubspec#dependencies

そしてflutter_icons:も追加

flutter_icons:
  android: true
  ios: true
  image_path: "assets/wastech_icon.png"

android, ios共にtrueにすることで、既存のFlutterアイコンを上書きできます。 image_pathには、アイコンとして使用したいファイルのパスを指定します。今回はassetsにwastech_icon.pngという名前のファイルを使っています。
詳しくは flutter_launcher_iconsのパッケージに記載あり。

Android
true：指定したプラットフォームのデフォルトの既存のFlutterランチャーアイコンを上書きする
false：このプラットフォーム用のランチャーアイコンの作成を無視する
image_path：アプリのランチャーアイコンとして使用するアイコン画像ファイルの場所です。

https://pub.dev/packages/flutter_launcher_icons

pubspec.yamlの登録を終えて終了ではなく、以下をターミナルで実行します。（自分はこれを忘れてて手こずった）

flutter pub get
flutter pub run flutter_launcher_icons:main

すると、以下のような文章がターミナルに表示され、アイコンが上書きされたことがわかります。

  ════════════════════════════════════════════
     FLUTTER LAUNCHER ICONS (v0.12.0)                               
  ════════════════════════════════════════════
  
• Creating default icons Android
• Overwriting the default Android launcher icon with a new icon

• Overwriting default iOS launcher icon with new icon

✓ Successfully generated launcher icons

Android emulatorやios Simulatorなどでアプリアイコンを確認すると、アイコンが変更されています！

この記事が気に入ったらサポートをしてみませんか？