58 lines
1.9 KiB
Dart
58 lines
1.9 KiB
Dart
import 'dart:math';
|
||
import 'package:flutter/material.dart';
|
||
|
||
class HeadingMarkerPainter extends CustomPainter {
|
||
final double headingAngle; // 航向角(度)
|
||
|
||
HeadingMarkerPainter({required this.headingAngle});
|
||
|
||
@override
|
||
void paint(Canvas canvas, Size size) {
|
||
// 中心点坐标(对应SVG的cx=20, cy=20)
|
||
final center = Offset(size.width / 2, size.height / 2);
|
||
// 圆圈半径(对应SVG的r=10)
|
||
final circleRadius = 10.0;
|
||
|
||
// ========== 1. 绘制绿色半透明圆圈(SVG的circle) ==========
|
||
final circlePaint = Paint()
|
||
..color = const Color(0xFF1AFA29)
|
||
.withOpacity(0.7) // #1afa29 70%透明度
|
||
..style = PaintingStyle.fill;
|
||
canvas.drawCircle(center, circleRadius, circlePaint);
|
||
|
||
// 绘制白色描边(SVG的stroke="#fff" stroke-width="2")
|
||
final strokePaint = Paint()
|
||
..color = Colors.white
|
||
..style = PaintingStyle.stroke
|
||
..strokeWidth = 2.0;
|
||
canvas.drawCircle(center, circleRadius, strokePaint);
|
||
|
||
// ========== 2. 绘制航向箭头(SVG的path) ==========
|
||
// 保存画布状态(旋转后恢复)
|
||
canvas.save();
|
||
// 平移+旋转:以圆心为旋转中心,根据航向角旋转(对应SVG的transform)
|
||
canvas.translate(center.dx, center.dy);
|
||
canvas.rotate(headingAngle * pi / 180); // 角度转弧度
|
||
|
||
// 箭头路径(对应SVG的d="M0,-8 L4,4 L0,1 L-4,4 Z")
|
||
final arrowPath = Path()
|
||
..moveTo(0, -8) // 顶部顶点
|
||
..lineTo(4, 4) // 右侧点
|
||
..lineTo(0, 1) // 中下点
|
||
..lineTo(-4, 4) // 左侧点
|
||
..close(); // 闭合路径
|
||
|
||
final arrowPaint = Paint()..color = Colors.white;
|
||
canvas.drawPath(arrowPath, arrowPaint);
|
||
|
||
// 恢复画布状态
|
||
canvas.restore();
|
||
}
|
||
|
||
@override
|
||
bool shouldRepaint(covariant HeadingMarkerPainter oldDelegate) {
|
||
// 航向角变化时重新绘制
|
||
return oldDelegate.headingAngle != headingAngle;
|
||
}
|
||
}
|