How to draw circle with 4 lines equal distance apart using drawLine() and drawCircle() in Flutter-CodePudding

How do I draw four lines across diameter on top of a circle so that it divides the circle up into equal parts (similar to a pizza)? I can so far use CustomPaint to create circle and draw one line, but each time I try to draw the other lines, they either overlap the bounds of the circle or are not equally distributed. Below is image of my current progress and code.

import 'dart:math';
import 'package:flutter/cupertino.dart';
import 'dart:ui' as ui;
import 'package:flutter/material.dart';

class CurvePainter extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    
    
    double degToRad(num deg) {
      return deg * (pi / 180.0).toDouble();
    }

    var paint = Paint();
    paint.color = Colors.white;
    paint.strokeWidth = 5;

    var paint1 = Paint()
      ..color = Color(0xff63aa65)
      ..style = PaintingStyle.fill;

  
    canvas.drawCircle(Offset(size.width / 2, size.height / 2), 150, paint1);

    canvas.drawLine(
      Offset(0, size.height / 2),
      Offset(size.width, size.height / 2),
      paint,
    );
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) => true;
}

Updated picture to display error

CodePudding user response：

To draw four lines on top of a circle that divide the circle into equal parts, you can use the drawLine() method in conjunction with the drawCircle() method.

The total angle for a full circle is 360 degrees, so to divide the circle into four equal parts, each line should be drawn at an angle of 360 / 4 = 90 degrees from the center.

Example, change your paint() method to :

var paint = Paint();
    paint.color = Colors.white;
    paint.strokeWidth = 5;
    
    var center = Offset(size.width / 2, size.height / 2);
    var radius = 150;
    
    canvas.drawCircle(center, radius, paint1);

    canvas.drawLine(
      center,
      center   Offset(radius * cos(degToRad(0)), radius * sin(degToRad(0))),
      paint,
    );
    canvas.drawLine(
      center,
      center   Offset(radius * cos(degToRad(90)), radius * sin(degToRad(90))),
      paint,
    );
    canvas.drawLine(
      center,
      center   Offset(radius * cos(degToRad(180)), radius * sin(degToRad(180))),
      paint,
    );
    canvas.drawLine(
      center,
      center   Offset(radius * cos(degToRad(270)), radius * sin(degToRad(270))),
      paint,
    );