circular_progress_stack 0.0.3 circular_progress_stack: ^0.0.3 copied to clipboard
This package use for easy to create multple and single circular progress bar. and you can set gradient and animatation duration.
Stack Circular Progress #
Make an Simple or Animated multiple and single circular progress bar using Stack Circular Progress.
Screenshots #
Stack Circular #
Simple Cricular Porgress | Animated Cricular Porgress | Gradient Cricular Porgress |
---|---|---|
Single Circular #
Simple Cricular Porgress | Animated Cricular Porgress | Gradient Cricular Porgress |
---|---|---|
Getting started #
Installing #
dependencies:
circular_progress_stack: ^0.0.3
Import #
import 'package:circular_progress_stack/circularprogressstack.dart';
Example #
Stack Circular #
Simple Stack Circular Progress #
Center(
child: SimpleNewStackCircularProgressBar(
size: 200,
progressStrokeWidth: 15,
backStrokeWidth: 15,
startAngle: 0,
backColor: const Color(0xffD7DEE7),
bars: [
SimpleNewBarValue(
barColor: Colors.red,
barValues: 50,
fullProgressColors: Colors.red,
),
SimpleNewBarValue(
barColor: Colors.green,
barValues: 50,
fullProgressColors: Colors.red,
),
SimpleNewBarValue(
barColor: Colors.blue,
barValues: 100,
fullProgressColors: Colors.red,
),
],
),
),
Animated Stack Circular Progress #
Center(
child: AnimatedStackCircularProgressBar(
size: 200,
progressStrokeWidth: 15,
backStrokeWidth: 15,
startAngle: 0,
backColor: const Color(0xffD7DEE7),
bars: [
AnimatedBarValue(
barColor: Colors.red,
barValues: 100,
fullProgressColors: Colors.red,
),
AnimatedBarValue(
barColor: Colors.green,
barValues: 70,
fullProgressColors: Colors.red,
),
AnimatedBarValue(
barColor: Colors.blue,
barValues: 70,
fullProgressColors: Colors.red,
),
],
),
),
Gardient Animated Stack Circular Progress #
Center(
child: GardientStackCircularProgressBar(
size: 200,
progressStrokeWidth: 15,
backStrokeWidth: 15,
startAngle: 0,
mergeMode: true,
maxValue: 100,
backColor: const Color(0xffD7DEE7),
bars: [
GardientBarValue(
barColores: [
Colors.red,
Colors.blue,
],
barValues: 70,
fullProgressColors: Colors.red,
),
GardientBarValue(
barColores: [
Colors.blue,
Colors.yellow,
],
barValues: 50,
fullProgressColors: Colors.yellow,
),
GardientBarValue(
barColores: [
Colors.green,
Colors.orange,
],
barValues: 70,
fullProgressColors: Colors.orange,
),
],
),
),
Single Circular #
Simple Stack Circular Progress #
Center(
child: SingleSimpleStackCircularProgressBar(
size: 200,
progressStrokeWidth: 15,
backStrokeWidth: 15,
startAngle: 0,
backColor: Color(0xffD7DEE7),
barColor: Colors.red,
barValue: 70,
),
);
Animated Stack Circular Progress #
Center(
child: SingleAnimatedStackCircularProgressBar(
size: 200,
progressStrokeWidth: 15,
backStrokeWidth: 15,
startAngle: 0,
backColor: Color(0xffD7DEE7),
barColor: Colors.blue,
barValue: 70,
),
);
Gardient Animated Stack Circular Progress #
Center(
child: SingleGradientStackCircularProgressBar(
size: 200,
progressStrokeWidth: 15,
backStrokeWidth: 15,
startAngle: 0,
mergeMode: true,
maxValue: 100,
backColor: Color(0xffD7DEE7),
barColores: [Colors.red, Colors.blue, Colors.green],
fullProgressColor: Colors.green,
barValue: 99,
),
);
Support #
If you find any bugs or issues while using the plugin, please register an issues on GitHub. You can also contact us at mistrytrushar88@gmail.com.
Want to contribute #
If you would like to contribute to the plugin (e.g. by improving the documentation, solving a bug or adding a cool new feature), feel free to send your pull request.
Author #
This circular_progress_stack plugin for Flutter is developed by Trushar Mistry.