flutter_progress_loading 0.0.6 copy "flutter_progress_loading: ^0.0.6" to clipboard
flutter_progress_loading: ^0.0.6 copied to clipboard

A lightweight and efficient loading and toast widget for Flutter, requiring no BuildContext. Supports iOS, Android, and Web for a seamless user experience.

πŸš€ Flutter Progress Loading #

pub package

A lightweight, customizable Flutter loading indicator with progress tracking, animations, and toast messages.

🌟 Why use flutter_progress_loading?

βœ… Lightweight & Fast
βœ… Multiple Loading Styles (Dark, Light, Custom)
βœ… Progress Bar Support
βœ… Animated Custom Loaders
βœ… Configurable Toast Messages
βœ… dismissOnTap to allow user interactions


πŸ›  Installation #

Add this package to your pubspec.yaml:

dependencies:
  flutter_progress_loading: ^latest

Then, run:

flutter pub get

πŸ“Œ Basic Usage #

Initialize in MaterialApp

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Progress Loading',
      theme: ThemeData(primarySwatch: Colors.blue),
      home: MyHomePage(),
      builder: ProgressLoading.init(),
    );
  }
}

Show Different Loaders

ProgressLoading.show(status: 'Loading...');

ProgressLoading.showProgress(0.3, status: 'Downloading...');

ProgressLoading.showSuccess('Great Success!');

ProgressLoading.showError('Oops! Something went wrong.');

ProgressLoading.showToast('This is a toast message.');

ProgressLoading.dismiss(); // Hide loader

Listening to Loading Status

ProgressLoading.addStatusCallback((status) {
      print('Loading Status: $status');
});

To remove:

ProgressLoading.removeCallback(statusCallback);

ProgressLoading.removeAllCallbacks();

🎨 Customization Options #

To fully customize the loader, modify these properties:

❗️Note:

  • textColor、indicatorColor、progressColor、backgroundColor only used for ProgressLoadingStyle.custom.

  • maskColor only used for ProgressLoadingMaskType.custom.

/// loading style, default [ProgressLoadingStyle.dark].
ProgressLoadingStyle loadingStyle;

/// loading indicator type, default [ProgressLoadingIndicatorType.fadingCircle].
ProgressLoadingIndicatorType indicatorType;

/// loading mask type, default [ProgressLoadingMaskType.none].
ProgressLoadingMaskType maskType;

/// toast position, default [ProgressLoadingToastPosition.center].
ProgressLoadingToastPosition toastPosition;

/// loading animationStyle, default [ProgressLoadingAnimationStyle.opacity].
ProgressLoadingAnimationStyle animationStyle;

/// loading custom animation, default null.
ProgressLoadingAnimation customAnimation;

/// textAlign of status, default [TextAlign.center].
TextAlign textAlign;

/// textStyle of status, default null.
TextStyle textStyle;

/// content padding of loading.
EdgeInsets contentPadding;

/// padding of [status].
EdgeInsets textPadding;

/// size of indicator, default 40.0.
double indicatorSize;

/// radius of loading, default 5.0.
double radius;

/// fontSize of loading, default 15.0.
double fontSize;

/// width of progress indicator, default 2.0.
double progressWidth;

/// width of indicator, default 4.0, only used for [ProgressLoadingIndicatorType.ring, ProgressLoadingIndicatorType.dualRing].
double lineWidth;

/// display duration of [showSuccess] [showError] [showInfo], default 2000ms.
Duration displayDuration;

/// animation duration of indicator, default 200ms.
Duration animationDuration;

/// color of loading status, only used for [ProgressLoadingStyle.custom].
Color textColor;

/// color of loading indicator, only used for [ProgressLoadingStyle.custom].
Color indicatorColor;

/// progress color of loading, only used for [ProgressLoadingStyle.custom].
Color progressColor;

/// background color of loading, only used for [ProgressLoadingStyle.custom].
Color backgroundColor;

/// mask color of loading, only used for [ProgressLoadingMaskType.custom].
Color maskColor;

/// should allow user interactions while loading is displayed.
bool userInteractions;

/// should dismiss on user tap.
bool dismissOnTap;

/// indicator widget of loading
Widget indicatorWidget;

/// success widget of loading
Widget successWidget;

/// error widget of loading
Widget errorWidget;

/// info widget of loading
Widget infoWidget;

Because of ProgressLoading is a singleton, so you can custom loading style any where like this:

ProgressLoading.instance
..displayDuration = const Duration(milliseconds: 2000)
..indicatorType = ProgressLoadingIndicatorType.fadingCircle
..loadingStyle = ProgressLoadingStyle.dark
..indicatorSize = 45.0
..radius = 10.0
..progressColor = Colors.yellow
..backgroundColor = Colors.green
..indicatorColor = Colors.yellow
..textColor = Colors.yellow
..maskColor = Colors.blue.withOpacity(0.5)
..userInteractions = true
..dismissOnTap = false
..customAnimation = CustomAnimation(
);

More indicatorType can see in πŸ‘‰ flutter_spinkit showcase

πŸ”Ή See all properties in the Full Customization Guide


🎬 Custom Animations #

You can create a custom loading animation like this:

class CustomAnimation extends ProgressLoadingAnimation {
  @override
  Widget buildWidget(Widget child) {
    return ScaleTransition(scale: animation, child: child);
  }
}

πŸ‘‰ See full example


πŸ“ Changelog & Roadmap #

βœ… Progress Indicator
βœ… Custom Animation Support
⬜ Add More Animation Types (Upcoming)
View Full Changelog


πŸ’œ License #

This package is licensed under the MIT License.
View License


πŸ“’ Support & Contributions #

πŸ’™ If you like this package, give it a ⭐ on GitHub
πŸ“’ Report issues or suggest features in the Issues section


4
likes
150
points
18
downloads

Publisher

unverified uploader

Weekly Downloads

A lightweight and efficient loading and toast widget for Flutter, requiring no BuildContext. Supports iOS, Android, and Web for a seamless user experience.

Homepage
Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

back_button_interceptor, flutter, flutter_spinkit

More

Packages that depend on flutter_progress_loading