🔨

Flutterのシミュレータにアプリのアイコンを設定する方法

2021/06/26に公開

Flutterでアプリのアイコンを設定する方法をまとめました。

概要

・flutter_launcher_iconsというパッケージをインストールhttps://pub.dev/packages/flutter_launcher_icons
・画像を設定
・ターミナルで反映させるためのコマンドを実行
・デバッグを再起動

Flutterでは、https://pub.dev/flutter/packages　に様々なパッケージが存在しています。実際に、それなりの規模のアプリを作成する際には、これらのパッケージを使いこなす必要があります。

今回は、パッケージの中のflutter_launcher_iconsを使います。これは、記事タイトルの通り、アプリのアイコンを設定してくれるパッケージです。

Flutterでは、外部の何かを取り込みたいときは、基本的に、pubspec.yamlの中に書き込みます。
pubspac.yamlの中のdependenciesを探して、以下のように書き込みます。
※インデントに注意してください

dependencies:
  flutter:
    sdk: flutter
  flutter_launcher_icons: ^0.9.0

pubspec.yamlの、dev_dependenciesの下に、以下のコードを書き込みます。

flutter_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon.png"

image_pathにアイコンとして設定したい画像のパスを指定してください。

pubspec.yamlの変更を反映させるために、エディタの上に出ている”pub get”をクリックしてください。

もしくは、ターミナルでFlutterプロジェクトに移動し、

$ flutter pub get

を実行してください。

最後に、アイコンを表示するパッケージを走らせます。
ターミナルに移動し、

$ flutter pub run flutter_launcher_icons:main

を実行してください。
これでアイコンの設定は完了です。

反映されない方は、デバッグの再起動が必要なので、エディタの緑の三角か、緑の虫をクリックして、
DebugをRerunさせてください。

本日まとめた内容は、

パッケージのサイトの、'Readme'という部分に書いてあるので、是非公式の物も参考にしながら試してみてください。
英語なので、わかりづらいこともあると思いますが、基本的には、乗っているコードの部分を順番に打っていればうまくいくので、ビビらずやってみてください。