Flutterの質問
質問日時
2021年06月30日
a-sato現在アプリを起動してロードが終わるまでの間、白一色のスプラッシュスクリーンが表示されるのですが、どうすれば変更できますか?
環境
Flutter 2.2.2
Android Studio 4.2.1
2021年06月30日
d-okflutter_native_splashを使って変更できます。
まず、pubspec.yamlのdev_dependencyにflutter_native_splashを追加して、pub get
します。
dev_dependencies:
flutter_native_splash: ^1.2.0 #2021/06/30の最新
続けてpubspec.yamlに内に設定を追記します。
flutter_native_splash:
color: "#42a5f5" #背景色(必須)
# 以下は任意項目です。
#image: assets/splash.png #画像ファイル(pngファイルのみ)
#color_dark: "#042a49" #ダークモード時の背景色
#image_dark: assets/splash-invert.png #ダークモード時の画像
# プラットフォームごとにスプラッシュスクリーンの有無を設定
#android: false
#ios: false
#web: false
# スプラッシュスクリーンの位置に関する項目
#android_gravity: center #(詳細: https://developer.android.com/reference/android/view/Gravity)
#ios_content_mode: center #(詳細: https://developer.apple.com/documentation/uikit/uiview/contentmode)
#web_image_mode: center #(center、contain、stretch、coverから選択)
# 通知バーを非表示にするにはfullscreenを設定します。webには通知バーがないので影響はありません。デフォルトはfalseです。
# NOTE: androidと異なり、iOSはアプリのロード時に自動的に通知バーを表示しません。
# 通知バーを表示するには、以下のコードをアプリに追記します。
# WidgetsFlutterBinding.ensureInitialized();
# SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom, SystemUiOverlay.top]);
#fullscreen: true
# info.plistファイルの名前を変更する場合は、以下の項目から設定出来ます。
# 設定する場合は「#」のみ削除して、スペースは消さないようにして下さい。
#info_plist_files:
# - 'ios/Runner/Info-Debug.plist'
# - 'ios/Runner/Info-Release.plist'
設定が完了したら以下のコマンドを実行するとスプラッシュスクリーンが設定されます。上記のコードをそのまま貼り付けると、スプラッシュスクリーンが水色に変更されるはずです。
flutter pub run flutter_native_splash:create
以下のように画像を追加することも出来ます。
元に戻すには下記を実行します。
flutter pub run flutter_native_splash:remove
1件の回答
2021年06月30日
d-ok関連した質問
質問日時 2023年07月31日
質問日時 2021年07月01日
質問日時 2021年05月20日
質問日時 2021年05月14日
質問日時 2021年05月14日
Flutterの記事
2021年10月20日
package:flutter_lintsの導入
2021年10月06日
Flutterでウェブアプリケーションを作ってみる
2021年09月29日
Flutter 2.5.0にアップデートした際に発生したエラー
2021年09月15日
CocoaPodsを更新しても、iOS版がビルドできない場合
2021年08月25日
Androidビルド作成時またエラーが発生したので、その対応方法
2021年08月16日
just audio 0.2.2から0.7.4+1に更新後の挙動の変化