Flutter では、デフォルトのアイコンが設定されています。
このアイコンを変更するには、色々な方法がありますが、今回は、flutter_launcher_iconsパッケージを利用する方法を説明いたします。
このパッケージを利用することで、簡単にアイコンを変更することができます。
アイコンの準備
アイコンに利用するイメージファイルを用意します。
イメージファイルについては、下記の条件を満たす必要があります。
・PNG
・1024以上のサイズ
・ファイルサイズは1024KB以内
準備したファイルを assets/images/app_icon.pngに保存します。
flutter_launcher_icons インストール
下記のコマンドを実行してflutter_launcher_iconsパッケージをインストールします。
|
1 |
$ flutter pub add flutter_launcher_icons --dev |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
Resolving dependencies... + archive 3.3.5 + args 2.3.2 async 2.9.0 (2.10.0 available) boolean_selector 2.1.0 (2.1.1 available) + checked_yaml 2.0.2 + cli_util 0.3.5 collection 1.16.0 (1.17.0 available) + convert 3.1.1 + crypto 3.0.2 + flutter_launcher_icons 0.11.0 + image 3.3.0 (4.0.10 available) + js 0.6.5 (0.6.6 available) + json_annotation 4.8.0 matcher 0.12.12 (0.12.14 available) material_color_utilities 0.1.5 (0.2.0 available) path 1.8.2 (1.8.3 available) + petitparser 5.1.0 + pointycastle 3.6.2 source_span 1.9.0 (1.9.1 available) stack_trace 1.10.0 (1.11.0 available) stream_channel 2.1.0 (2.1.1 available) string_scanner 1.1.1 (1.2.0 available) test_api 0.4.12 (0.4.18 available) + typed_data 1.3.1 vector_math 2.1.2 (2.1.4 available) win32 3.1.3 (4.1.0 available) + xml 6.1.0 (6.2.2 available) + yaml 3.1.1 Downloading flutter_launcher_icons 0.11.0... Downloading cli_util 0.3.5... Downloading checked_yaml 2.0.2... Downloading json_annotation 4.8.0... Downloading args 2.3.2... Downloading image 3.3.0... Downloading petitparser 5.1.0... Downloading archive 3.3.5... Downloading pointycastle 3.6.2... Downloading js 0.6.5... Downloading convert 3.1.1... Changed 15 dependencies! |
アプリのアイコン設定
プロジェクト内に、アイコンを保存するためのディレクトリを作成し、そこにアイコンの画像を配置します。
今回の例では、 assets/images に保存しています。
pubspeck.yaml
|
1 2 3 4 5 |
# 追加 flutter_icons: android: true ios: true image_path: "assets/images/logo.png" |
android: true ios: true
このように記述することで、android, iOS の両方で指定したアプリのアイコンが使用できるようになります。
アイコン生成
下記のコマンドを実行して、アプリのアイコンを生成します。
|
1 |
flutter pub run flutter_launcher_icons:main |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
This command is deprecated and replaced with "flutter pub run flutter_launcher_icons" ???????????????????????????????????????????? FLUTTER LAUNCHER ICONS (v0.11.0) ???????????????????????????????????????????? ? Creating default icons Android ? Overwriting the default Android launcher icon with a new icon ? Overwriting default iOS launcher icon with new icon Creating Icons for Web... Creating Icons for Windows... Creating Icons for MacOS... ?Successfully generated launcher icons |
flutter_launcher_icons 公式
flutter_launcher_icons | Dart Package
A package which simplifies the task of updating your Flutter app's launcher icon.
pub.dev
参考サイト
Flutterで、アイコンを変更する方法については、こちらのサイトを参考にさせていただきました。
【Flutter】アプリアイコンを変更する
https://qiita.com/KKoichi51/items/edca3f934b0b4a3a6a25
