How to make sweepGradient to start applying from the top of a circle in flutter?

Question

I want to create something like this in flutter.

Here is my code

import 'package:flutter/material.dart';
import 'dart:math';

class Arc extends CustomPainter {
    final double angle = 210.0;
double doubleToAngle(double angle) => angle * pi / 180.0;

Arc(this.angle);

void drawArcWithRadius(
    Canvas canvas, Offset center, double radius, double angle, Paint paint) {
    canvas.drawArc(Rect.fromCircle(center: center, radius: radius),
        doubleToAngle(-90.0), doubleToAngle(angle), true, paint);
}

@override
void paint(Canvas canvas, Size size) {
    final Offset center = Offset(size.width / 2.0, size.height / 2.0);
    final double radius = size.width / 3.0;
    print("Size $size");
    print("Width ${size.width}");
    print("Size $center");
    print("Size $radius");
    Paint paint = Paint()
        ..strokeCap = StrokeCap.round
        ..strokeWidth = 20.0
        ..style = PaintingStyle.stroke
        ..color = Colors.red
        ..shader = new SweepGradient(
            colors: [
//          Color(0xFFFE7E00),
//          Color(0xFFFD0000),
                    Colors.green,
                    Colors.blue,
                ],
                startAngle: 0.0,
                endAngle: doubleToAngle(angle)
            ).createShader(Rect.fromCircle(center: center, radius: radius));
        drawArcWithRadius(canvas, center, radius, angle, paint);
    }
@override
bool shouldRepaint(CustomPainter oldDelegate) {
    return true;
}
}

But what i end up is something like this. It seems like gradient doesn't start from the top. How can I solve that issue?

Answer 1

Be careful that SweepGradient's angles start from the direction of 3 o'clock and they are clockwise manners.

So you should set parameters as below:

    final gradient = new SweepGradient(
      startAngle: 3 * math.pi / 2,
      endAngle: 7 * math.pi / 2,
      tileMode: TileMode.repeated,
      colors: [startColor, endColor],
    );

Check my sample code as a reference if you like. https://stackoverflow.com/a/54970376/845627