ロード画面の実装にmodal_progress_hud【Flutter】【Loading】
Flutterでローディング画面の実装
Flutterのパッケージに「modal_progress_hud」という便利な機能があったので記録しておく。
こちらのパッケージを使えば、簡単にローディング中の画面を実装することができる。
modal_progress_hudの導入方法
下記のレジュメの通り。
ステップ1:pubspec.yamlファイルに依存関係の追加
dependencies:
modal_progress_hud: ^0.1.3
ステップ2:インストール
$ flutter pub get
ステップ3:インポート
使うファイルでインポート
import 'package:modal_progress_hud/modal_progress_hud.dart';
modal_progress_hudの使用方法
使用方法も上記のリンクを参照すれば簡単に実装できる。
ポイントは以下
- 変数名を真偽値で指定する
- Body要素のところで「ModalProgressHUD」で囲う
- inAsyncCall: _savingのようにセットする。
- ボタンを押す箇所のように実際にしようするところで、setStateをTrueにしてローディング画面を登場させる
Android/iOSクロス開発フレームワーク Flutter入門