如何绘制重叠的圆圈

时间:2019-03-23 18:06:35

标签: flutter trigonometry

我需要对这些白色交织在一起的圆圈(而不是背景)进行编码:

enter image description here

我知道如何画一个圆。 使我难以理解的是数学。

注意: 是的,我很清楚三角学是高中的东西。

1 个答案:

答案 0 :(得分:6)

正如贝雷亚尔所说:

  

第k个中心的坐标为(r cos kx,r sin kx),其中r是半径,x = 2 * pi / n,其中n是圆数您需要。

以下是示例操作方法:

import 'dart:math';

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: CustomPaint(
            foregroundPainter: CustomCirclesPainter(),
          ),
        ),
      ),
    );
  }
}

class CustomCirclesPainter extends CustomPainter {
  var myPaint = Paint()
    ..color = Colors.black
    ..style = PaintingStyle.stroke
    ..strokeWidth = 5.0;

  double radius = 80;

  @override
  void paint(Canvas canvas, Size size) {
    int n = 10;
    var range = List<int>.generate(n, (i) => i + 1);
    for (int i in range) {
      double x = 2 * pi / n;
      double dx = radius * cos(i * x);
      double dy = radius * sin(i * x);
      canvas.drawCircle(Offset(dx, dy), radius, myPaint);
    }
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) {
    return true;
  }
}