flutter pub add loading_overlay根據套件公開資料產生的選型評估，僅供參考。
一個 Flutter 套件，提供了一個模態進度指示器元件，設計為平滑地淡入淡出。它包裝任何元件，在異步操作（例如 API 呼叫或資料處理）期間暫時阻擋使用者互動。非常適合在不中斷 UI 流程的情況下顯示載入狀態。該覆蓋層可透過程式碼控制，提供一種乾淨且可自訂的方式來指示多個平台上的持續任務。
以下為關聯原始碼儲存庫的 README 原文快照，最新內容請造訪原始碼儲存庫。
A simple widget wrapper to enable modal progress HUD (a modal progress indicator, HUD = Heads Up Display).
Started as a fork of modal_progress_hud Inspired by this article.
See example for details
Add the package to your pubspec.yml file.
dependencies:
loading_overlay: ^0.4.0
Next, import the library into your widget.
import 'package:loading_overlay/loading_overlay.dart';
Now, all you have to do is simply wrap your widget as a child of LoadingOverlay, typically a form, together with a boolean that is maintained in local state.
...
bool _isSaving_ = false
...
@override
Widget build(BuildContext context) {
return Scaffold(
body: LoadingOverlay(
color: Colors.black.withOpacity(0.5),
child: Container(
Form(...)
),
isLoading: _isSaving_
),
);
}
Alternatively, show the overlay until a Future completes (non-breaking new feature):
// Start an async operation
final saveFuture = _saveFormAsync();
return LoadingOverlay.withFuture(
future: saveFuture,
color: Colors.black.withOpacity(0.5),
child: Form(...),
);
The current parameters are customizable in the constructor
LoadingOverlay({
required bool isLoading,
required Widget child,
Widget progressIndicator = const CircularProgressIndicator(),
Color? color,
});
// New: show overlay until a Future completes
LoadingOverlay.withFuture({
required Future<void> future,
required Widget child,
Widget progressIndicator = const CircularProgressIndicator(),
Color? color,
});
Update: See this article on Medium about async form validation
See the example application source for a complete sample app using the modal progress HUD. Included in the example is a method for using a form's validators while making async calls (see flutter/issues/9688 for details).
Please file issues to send feedback or report a bug. Thank you!