😅

flutter_native_splashで詰まった事

2023/01/05に公開

flutter_native_splashで詰まった事と解決方法

Flutterで簡単にSplashScreenを実装することができるパッケージflutter_native_splashで詰まった事と解決した方法を記載します。

スプラッシュスクリーンを変更した際に、変更前のスプラッシュスクリーンが消えない

問題

スプラッシュスクリーンを変更したが、以前のスプラッシュスクリーンが消えずに、二重にスプラッシュスクリーンが表示される状態。

解決方法

キャッシュ等が残っていることが原因なので、下記のコマンドを順に実行する。
下記を実行しても治らない場合は、アプリを削除し再度ビルドを行う。

flutter clean

flutter pub get

flutter pub run flutter_native_splash:remove

flutter clean

flutter pub get

flutter pub run flutter_native_splash:create

参考リンク

Android12でアイコン画像が表示されない

問題

公式のドキュメントのAndroid12に関する記述通りに実装したが、Androidシュミレーターでスプラッシュスクリーンのアイコン画像が表示されない。

解決方法

VScodeやAndroidStudioからではなく、Androidシュミレーター内の対象のアプリアイコンをタップして起動する事で、表示される。
参考リンク

Android12でアイコン画像のサイズが違い、ぼやけてる

問題

Android12でアイコン画像がどアップになっており、画像がぼやけている。

解決方法

アイコン画像のサイズを1152×1152に変更する。
(png画像自体を大きくするのではなく、元のpng画像の周りに余白を作る)

Android12とAndroid12以外でスプラッシュスクリーンが変わらない

問題

Android12では背景に画像を利用する事ができない為、Android12では背景にカラーを利用し、Android12以外では背景に画像を利用したかったが、Android12以外も背景がカラーになってしまった。

解決方法

flutter_native_splashのコマンドを実行すると、ios用やAndroid12用、Android用に自動でスプラッシュスクリーン用の画像が生成される。Android12とその他Androidで同じ画像が生成されている事が原因だった為、手動で背景画像を変更する。(他にいい方法があるかもしれません。)

1:1の比率の背景画像を用意する。
下記2つのファイル内のbackground.pngを用意した1:1の背景画像に置き換える
android/src/main/res/drawable
android/src/main/res/drawable-v21
参考リンク

Discussion