带凹槽画布的点圆圈(自定义油漆和自定义油漆工)

Question

在我的学校项目中，我需要用Custom Painter(Flutter(画一个虚线圆圈。我如何在画布上画一个虚线圆圈。我只知道如何在画布上画实心圆。如果你知道的话，请回答我。不要跳过。非常感谢。

我试着在互联网上到处找，但找不到。我希望我能从StackOverflow获得解决方案。

Answer 1

你说过可以画一个实心圆。画一个虚线圆圈是非常相似的。使用for循环，您只需绘制一堆实心圆，这些圆一起形成虚线圆。每个单独圆的偏移量可以使用基本三角法来确定。代码示例：

import 'package:flutter/material.dart';
import "dart:math";
void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
backgroundColor: Colors.white,
body: CustomPaint(
size: const Size(
100,
100,
),
painter: MyPainter(
20,
),
),
),
);
}
}
class MyPainter extends CustomPainter {
MyPainter(this.radius);
final double radius;
@override
void paint(Canvas canvas, Size size) {
final double centerX = size.width / 2;
final double centerY = size.height / 2;
final Paint paint = Paint()..color = Colors.black;
final double filledCircleRadius = 3;
final int numberOfDots = 10;
final double radiantStep = 2 * pi / numberOfDots;
for (int i = 0; i < numberOfDots; i++) {
canvas.drawCircle(
Offset(centerX + sin(i * radiantStep) * radius,
centerY + cos(i * radiantStep) * radius),
filledCircleRadius,
paint,
);
}
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return false;
}
}