我如何在一个圆的顶端画四条横跨直径的线,以便将圆分成相等的部分(类似于披萨)?到目前为止,我可以使用CustomPaint创建圆并绘制一条线,但每次try 绘制其他线时,它们要么与圆的边界重叠,要么不是均匀分布.下面是我目前的进度和代码的图像.

enter image description here

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;
}

Error Image: enter image description here

推荐答案

要在将圆等分成等分的圆的顶部绘制四条线,可以将drawLine()方法与drawCircle()方法结合使用.

一个完整的圆的总Angular 是360 degrees,因此要将圆分成四个相等的部分,每条线都应该与中心成360 / 4 = 90度的Angular 绘制.

例如,将您的paint()方法更改为:

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,
    );

Flutter相关问答推荐

当MyChangeNotifier更改时如何计算函数,而无需在构建方法中进行不必要的调用- Flutter

遇到图像路径格式问题

无效参数(S):隔离消息中的非法参数:try 旋转图像时对象不可发送

我想在Flutter中画一个箭头,但我似乎无法填满空间

为Android生成时出现Flutter 错误:给定资源值的<;COLOR&>无效

如何在列表视图生成器中显示图像

Flutter:如何在现有布局之上显示圆角布局?

如何在Flutter中的textField中在可编辑文本和前缀图标之间添加空格?

Riverpod 2.3.6:AutoDisposeNotifier和ref.onDispose自动处理

Flutter:如何从运行时创建的列表中访问单个子部件的值

切换 Firebase 项目后 Flutter FirebaseAuthException 'configuration-not-found'

如果不刷新页面,我看不到从 Firestore 中提取的数据

如何在 flutter 中同时使用 ButtonStyle() 和 ElevatedButton.styleFrom() ?

我想在一个屏幕上有两个相同区域的列表视图,我该如何设置?

无法在 flutter 中更新 void 方法内的变量值

.info/connected 这两个代码之间有什么区别吗?

如何获得Flutter 的时差?

Flutter 如何要求用户在应用程序中设置电话密码?

type '_InternalLinkedHashMap' 不是使用 http 包的'String' 类型的子类型

如何在Flutter 中专注于列表视图中最新添加的项目