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.
-
Multiple indicator variants:
linearcircularoverlaypercentageText
-
Supports custom child builder via
childBuilder -
Configurable size, radius, color, etc
-
Responsive to
ImageFieldCubitstate changes
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()}%'),
);| 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. |
- Displays a circular progress bar
- Standard linear indicator with background color
- Displays a file preview with a centered progress overlay
- Text-only indicator showing percentage progress
Ensure you have the following packages:
dependencies:
flutter:
flutter_bloc: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.
© MIT License. Developed with ❤️ by Shohidul Islam