JINMUSOFTWARE

JINMUSOFTWARE

Flutterでアプリアイコンを作成する方法

公開日: / 最終更新日: / カテゴリ: Flutter / 投稿者: matsuda
App Icon - Flutter

Flutter Launcher Icons

flutterには便利なパッケージがあります。「flutter_launcher_icons」です。

flutter_launcher_icons – pub.dev

xcodeに詳しい方はxcodeで設定することも可能です。

今であれば、「Icon Composer」を使用してアプリアイコンを作成するようですね。

動作環境

⚠️この記事の対象プラットフォームはiOSです。すいません。

  • Mac mini Apple M4
  • macOS Tahoe version 26.3.1(a)
  • Flutter 3.41.7
  • flutter_launcher_icons 0.14.4

アプリアイコンを作成する

アプリアイコン用の画像を用意する

画像の仕様（iOS用の仕様です。）

  • png画像
  • 1024×1024サイズ
  • 絵柄の大きさは890px以下（Paddingを考慮）

画像は3枚用意します。

  • 明るいテーマ用x1枚：透過なし
  • 暗いテーマ用x1枚：透過あり
  • グレースケール用x1枚：透過あり

以下のような画像を用意してみました。（絵柄がちょっと小さかったですね。）

light
dark
gray scale

Flutter Launcher Icons をインストールする

Bash
flutter pub add flutter_launcher_icons

設定ファイルを生成する

Bash
dart run flutter_launcher_icons:generate

「flutter_launcher_icons.yaml」が生成されます。

flutter_launcher_icons.yamlを編集する

YAML
flutter_launcher_icons:
  ios: true
  remove_alpha_ios: true
  image_path_ios: "assets/appicon/earth_1024_Q7_light.png"
  image_path_ios_dark_transparent: "assets/appicon/earth_1024_Q7_dark.png"
  image_path_ios_tinted_grayscale: "assets/appicon/earth_1024_Q7_gray.png"

アイコンを生成します

Bash
dart run flutter_launcher_icons

実行確認

ではビルドしてみましょう。実機やsimulatorで設定したアイコン画像になることを確認します。

どうですか？うまくいきましたか？　

Simulator(iOS26)では以下の様に表示されました。もちろんiOS18でも正常に表示されます。

light
dark
clear

さて、テーマごとのアイコンの確認方法は…

  • 画面の何も無いところを長押ししてアプリアイコンがプルプルするまで待つ。
  • 左上に出現した「編集」を押し、「カスタマイズ」を押す。
  • 画面下段にメニューが表示されテーマを選択できるようになる。
  • iOS26以上はlight, darkに加えてclearも選択できるようだ。

疑問

2025年9月あたりiOS26がリリースされました。

iOS26から「Liquid Glass」が採用されたのでアプリアイコンとか大丈夫かなと心配していました。

flutter_launcher_iconsはiOS26でも使えるのかな？

iOS26でも使えます。

先ほどの画像のSimulatorは、「iPhone13 Pro Max – iOS 26.4」です。

実機、「iPhone 12 – 26.3.1(a)」でも表示されました。

リリース申請通るのかな？

通りました。国旗クイズアプリを作ってみました。

まぁでも今後は、「Icon Composer」の使い方も覚えた方がいいのかなと感じています。

関係資料

Apple:

Flutter:

関連記事

おわり