flutter_progress_hud 2.0.2 copy "flutter_progress_hud: ^2.0.2" to clipboard
flutter_progress_hud: ^2.0.2 copied to clipboard

Highly customizable modal progress indicator with fade animation.

pub package

Flutter Progress HUD #

Highly customizable modal progress indicator with fade animation.

Preview #

Usage #

Wrap with ProgressHUD the widget on top of which you want to show the modal indicator.

ProgressHUD(
  child: HomePage(),
)
copied to clipboard

Get a reference of ProgressHUD

final progress = ProgressHUD.of(context);
copied to clipboard

Show indeterminate progress

progress.show();
copied to clipboard

Or a progress with text

progress.showWithText('Loading...');
copied to clipboard

Then dismiss

progress.dismiss();
copied to clipboard

Example (full) #

ProgressHUD(
        child: Builder(
          builder: (context) => Center(
                child: Column(
                  children: <Widget>[
                    RaisedButton(
                      child: Text('Show for a second'),
                      onPressed: () {
                        final progress = ProgressHUD.of(context);
                        progress.show();
                        Future.delayed(Duration(seconds: 1), () {
                          progress.dismiss();
                        });
                      },
                    ),
                    RaisedButton(
                      child: Text('Show with text'),
                      onPressed: () {
                        final progress = ProgressHUD.of(context);
                        progress.showWithText('Loading...');
                        Future.delayed(Duration(seconds: 1), () {
                          progress.dismiss();
                        });
                      },
                    ),
                  ],
                ),
              ),
        ),
      ),
copied to clipboard

Customization #

Attribute Name Default Value Description
indicatorColor Colors.white When using the default indicator widget, this is how you set its color
indicatorWidget A basic CircularProgressIndicator Custom indicator widget
backgroundColor Colors.black54 Indicator background color
backgroundRadius Radius.circular(8.0) Indicator background radius
borderColor Colors.white Indicator background border color
borderWidth 0.0 Indicator background border width
barrierEnabled true You can disable the modal barrier if you want to allow touches while the progress is shown
barrierColor Colors.black12 Color of the Barrier displayed behind the indicator
textStyle TextStyle(color: Colors.white, fontSize: 14.0) TextStyle for the Text displayed below the indicator
padding EdgeInsets.all(16.0)} Indicator content padding
130
likes
140
points
7.81k
downloads

Publisher

unverified uploader

Weekly Downloads

2024.08.11 - 2025.02.23

Highly customizable modal progress indicator with fade animation.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on flutter_progress_hud