FlutterGenとは
Flutterでは、アセット(画像や音楽データのリソース)をアプリに含めてリリースできます。一般的にはAssetsというディレクトリの中にデータを置きます。しかし、ファイルなので、普通に使用すると、ファイル名をコピーしないといけません。そのため、コピーの間違いなどが発生しますし、コピーするのが手間です。それを解決するのが、FlutterGenです。
Assetsの中のディレクトリを見て、ファイル名の代わりに使用できる、クラスを生成します。そのため、
- エディタの予測機能でファイル名を指定できる
- クラスなので、ファイル名を間違えない
この投稿では、FlutterGenをお手軽に使うための方法を紹介します。ちなみに作者はwasabeefさん、lcdsmaoさんという日本の方です。
インストール
以下を実施して、pubspec.yamlに依存性を入力します。
flutter pub add flutter_gen_runner --dev
flutter pub add build_runner --dev
flutter pub getアセットの設定
pubspec.yaml にアセットを設定します。今回の例は、以下のようにアセットの入っているディレクトリを指定します。
assets:
- assets/images/
- assets/sounds/再帰的にサブフォルダを見ません。そのため、各フォルダを指定する必要があります。
生成
flutter pub run build_runner build結果
lib/gen/assets.gen.dart が生成されます。このクラスの中にファイル名が記載されます。
soundsの中にwater.mp3という音声ファイルがあった場合、プログラム内からは、Assets.sounds.waterでアクセスできるようになります。
このとき、water.mp3とwater.m4aが存在した場合、waterMp3とwaterM4aでアクセスできるように変更されます。
注意点
実施して気がついたことを書き足していこうと思います。
- ファイル名が数字やアンダーバーから始まる場合、変換ができない
- 「The pubspec.lock file has changed since the .dart_tool\package_config.json file was generated, please run “flutter pub get” again.」のエラー
ファイル名の最初にアルファベットをつけましょう。
「flutter pub get」を2回繰り返すといけるらしい。駄目な場合、以下のページを参照。
まとめ
FlutterGenの使い方について記載いたしました。色々と設定できますが、一番お手軽な方法を記載しました。
以下のようなこともできますので、詳しい方法は、公式を参照してください。
- OS依存の設定をして高速に生成(たまにしかアセットを更新しないので､使用してません)
- 生成するクラスのディレクトリやファイル名の変更
- フォントや色のアセットの設定
