segmented_progress_bar

Description:

segmented progress bar

A customizable segmented progress bar.

Installation #
In the pubspec.yaml of your flutter project, add the following dependency:
dependencies:
flutter:
sdk:
segmented_progress_bar: any
copied to clipboard
Import the segmented progress bar package like this:
import 'package:segmented_progress_bar/segmented_progress_bar.dart';
copied to clipboard
Usage #
Simply create a SegmentedProgressBar widget, and pass the required params:
List<ProgressSegment> get socialSegments => [
ProgressSegment(value: 5, color: Colors.pink, label: 'Instagram \n 50%'),
ProgressSegment(
value: 3, color: Colors.indigo, label: 'Facebook \n 30%', isAbove: true, labelPadding: 20),
ProgressSegment(value: 1, color: Colors.redAccent, label: 'Threads \n 10%'),
ProgressSegment(
value: 3, color: Colors.lightBlue, label: 'Tweeter \n 20%', isAbove: true, labelPadding: 20),
];


@override
Widget build(BuildContext context) {
return Center(
child: SegmentedProgressBar(
segments: socialSegments,
),
);
}
copied to clipboard
Customization #
Customize the SegmentedProgressBar widget with these parameters:


/// List of segments in the progress bar
final List<ProgressSegment> segments;

/// Height of progress bar
/// Defaults to 20
final double height;

/// Border radius of progress bar
/// Defaults to 5
final double borderRadius;
copied to clipboard

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter