目次
きっかけ
月謝袋アプリの英語対応を進める中で、
起動時に表示される封筒の画像も英語版に差し替えることにしました。
スプラッシュ画像とローディング画像の違い
最初「スプラッシュ画像を変更しよう」と思っていたのですが、pubspec.yaml に flutter_native_splash の記述がない…🤔
調べてみると、これはスプラッシュ画像ではなく
ローディング画像でした！
(最初はFlutter Flowの設定で作り始めたので、このことを忘れてしまいました)
| 種類 | タイミング | 実装 |
|---|---|---|
| スプラッシュ画像 | アプリ起動の一瞬（OSレベル） | flutter_native_splash |
| ローディング画像 | Firebase初期化中に表示 | Image.asset() in nav.dart |
修正方法
nav.dart でこのように使われていました：
child: Image.asset(
'assets/images/TuitionEnvelope.png',
width: 300.0,
fit: BoxFit.cover,
),あとは assets/images/TuitionEnvelope.png を
新しい英語版画像に上書きするだけ！
コードの変更は一切不要でした✅
ローディング画像の方が使いやすい！
スプラッシュ画像はOSレベルの制約で小さくなりがちですが、
ローディング画像は width で自由にサイズを指定できます。
大きくロゴや画像を表示できるのが嬉しいポイントです📬
まとめ
- スプラッシュ ≠ ローディング画像
nav.dartのImage.assetを差し替えるだけで変更可能- サイズも自由に調整できて便利！
月謝袋アプリ：App Store / Google Play にて配信中
