/// Usage
CustomPaint(
painter: SegmentBorderPainter(
divisions: 3, // Number of divisions
gradient: const LinearGradient(
colors: [
Colors.orange,
Colors.orange,
Colors.red,
Colors.red,
],
),
),
child: Container(
height: 58.r,
width: 58.r,
child: SizedBox.shrink(),
),
),
),
/// CODE
class SegmentBorderPainter extends CustomPainter {
final int divisions;
final double strokeWidth;
final Gradient gradient;
SegmentBorderPainter({
required this.divisions,
this.strokeWidth = 3.0,
required this.gradient,
});
@override
void paint(Canvas canvas, Size size) {
final Paint paint = Paint()
..strokeWidth = strokeWidth
..style = PaintingStyle.stroke;
final double radius = size.width / 2;
final double angle = (2 * 3.141592653589793) / divisions;
const double startAngle = -3.141592653589793 / 2;
paint.shader = gradient.createShader(
Rect.fromCircle(center: Offset(radius, radius), radius: radius),
);
if (divisions == 1) {
canvas.drawCircle(Offset(radius, radius), radius, paint);
} else if (divisions == 2) {
for (int i = 0; i < divisions; i++) {
canvas.drawArc(
Rect.fromCircle(center: Offset(radius, radius), radius: radius),
startAngle + i * angle + 0.08,
angle * 0.95,
false,
paint,
);
}
} else {
for (int i = 0; i < divisions; i++) {
canvas.drawArc(
Rect.fromCircle(center: Offset(radius, radius), radius: radius),
startAngle + i * angle + 0.05,
angle * 0.95,
false,
paint,
);
}
}
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return false;
}
}
Comments