Flutterでスプラッシュ画面を作成しようと思い調べたところ下記の記事が見つかった。
flutter_native_splashをインストール
最新のバージョンをインストールしたいと思い下記のように記載しPub get
を行ったところエラーが発生した。
開発環境のDartのバージョンは2.14.3だが、このパッケージで必要なバージョンは2.15.1であるためのインストールできないらしい。
pubspec.yaml
dependencies:
flutter_native_splash: ^2.0.1+1
The current Dart SDK version is 2.14.3.
Because [プロジェクト名] depends on flutter_native_splash >=1.3.3 which requires SDK version >=2.15.1 <3.0.0, version solving failed.
pub get failed (1; Because tra_english_mobile depends on flutter_native_splash >=1.3.3 which requires SDK version >=2.15.1 <3.0.0, version solving failed.)
利用するパッケージのバージョンを下げたところ無事にインストールが完了した。
pubspec.yaml
dependencies:
flutter_native_splash: ^1.1.5+1
スプラッシュ画面の作成
スプラッシュ画面に表示したい画像と背景の色を設定する。
pubspec.yaml
flutter_native_splash:
image: "images/ToraChan.png"
color: "FFFFFF"
下記のコマンドを実行してスプラッシュ画面を生成する。
flutter pub pub run flutter_native_splash:create
[Android] Creating splash images
[Android] Updating launch background(s) with splash image path...
[Android] - android/app/src/main/res/drawable/launch_background.xml
[Android] - android/app/src/main/res/drawable-v21/launch_background.xml
[Android] Updating styles...
[Android] - android/app/src/main/res/values/styles.xml
[iOS] Creating splash images
[iOS] Updating LaunchScreen.storyboard with width, and height
[iOS] Updating ios/Runner/Info.plist for status bar hidden/visible
Web folder not found, skipping web splash update...
Native splash complete. �
Now go finish building something awesome! � You rock! ��
無事にスプラッシュ画面を作ることができた。
コードを書かなくてもスプラッシュ画面が作れるのは便利ですね。