Skip to content

Instantly share code, notes, and snippets.

@DanielCardonaRojas
Created November 26, 2020 15:51
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save DanielCardonaRojas/012933390d7a27e54001d97eccc673e0 to your computer and use it in GitHub Desktop.
Save DanielCardonaRojas/012933390d7a27e54001d97eccc673e0 to your computer and use it in GitHub Desktop.
CircularProgressBorder flutter widget
import 'package:flutter/material.dart';
import 'dart:math';
class CircularProgressBorder extends StatelessWidget {
final Color backgroundColor;
final Color progressColor;
final Color unfilledColor;
final double progress;
final double thickness;
final double offset;
final Widget child;
const CircularProgressBorder({
Key key,
@required this.child,
@required this.progressColor,
@required this.progress,
this.backgroundColor = Colors.white,
this.offset = 0,
this.thickness = 2,
this.unfilledColor = Colors.transparent,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final tau = 2 * pi;
return Stack(
children: [
Positioned.fill(
child: ShaderMask(
shaderCallback: (rect) {
return SweepGradient(
startAngle: 0,
endAngle: tau,
transform: GradientRotation(offset * tau),
stops: [progress, progress],
center: Alignment.center,
colors: [
progressColor,
unfilledColor,
]).createShader(rect);
},
child: Container(
decoration: const BoxDecoration(
shape: BoxShape.circle, color: Colors.white),
),
),
),
Positioned.fill(
left: thickness,
top: thickness,
right: thickness,
bottom: thickness,
child: FractionallySizedBox(
heightFactor: 1,
child: Container(
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
shape: BoxShape.circle, color: Colors.white),
child: Center(
child: child,
),
)),
),
],
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment