upload_progress_indicator
This component is a flexible and customizable widget for displaying file upload progress in Flutter applications. It supports multiple styles and allows for easy integration with Cubit state management using ImageFieldCubit.
✨ Features
-
Multiple indicator variants:
linearcircularoverlaypercentageText
-
Supports custom child builder via
childBuilder -
Configurable size, radius, color, etc
-
Responsive to
ImageFieldCubitstate changes
🚀 Usage
UploadProgressIndicator(
imageFieldCubit: yourCubitInstance,
variant: UploadIndicatorVariant.circular,
size: 48,
color: Colors.blue,
);
Or with a custom child:
UploadProgressIndicator(
imageFieldCubit: yourCubitInstance,
childBuilder: (progress) => Text('${(progress * 100).round()}%'),
);
🔧 Constructor Parameters
| Parameter | Type | Description |
|---|---|---|
imageFieldCubit |
ImageFieldCubit |
Required. Controls the upload progress state. |
variant |
UploadIndicatorVariant |
Optional. Defaults to linear. |
size |
double |
Optional. Default is 40. Used for size in circular/overlay. |
color |
Color? |
Optional. Custom color for indicator. |
radius |
double? |
Optional. Default is 20. Used for circular borderRadius in linear. |
childBuilder |
ProgressChildBuilder? |
Optional. Custom widget based on progress value. |
📁 Variant Details
🔵 CircularUploadProgressIndicator
- Displays a circular progress bar
🔷 LinearUploadProgressIndicator
- Standard linear indicator with background color
🖼 OverlayUploadProgressIndicator
- Displays a file preview with a centered progress overlay
🔢 PercentageTextUploadIndicator
- Text-only indicator showing percentage progress
📌 Dependencies
Ensure you have the following packages:
dependencies:
flutter:
flutter_bloc:
🧱 Extendability
To add a new variant:
- Add enum value to
UploadIndicatorVariant - Create a new widget implementing the new style
- Extend the switch-case in
UploadProgressIndicator
Made with ❤️ using SOLID principles and composable widgets for clean and maintainable UI components.
License
© MIT License. Developed with ❤️ by Shohidul Islam
Libraries
- enum/upload_indicator_variant
- type_def/type_def
- upload_progress_indicator
- views/widgets/indicator_variants/circular_upload_progress_indicator
- views/widgets/indicator_variants/linear_upload_progress_indicator
- views/widgets/indicator_variants/overlay_upload_progress_indicator
- views/widgets/indicator_variants/percentage_text_upload_indicator
- views/widgets/upload_progress_indicator