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:
linear
circular
overlay
percentageText
-
Supports custom child builder via
childBuilder
-
Configurable size, radius, color, etc
-
Responsive to
ImageFieldCubit
state 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