trackoffical_app/lib/view/ingame/game_guardian/widget_point.dart

import 'dart:typed_data';

import 'package:flutter/material.dart';
import 'package:trackoffical_app/generated/assets.dart';
import 'package:trackoffical_app/screen.dart';

class WidgetPoint extends StatelessWidget {
  final double width;
  final double height;
  final Color color;
  final Uint8List? imageBytes;

  const WidgetPoint(
      {super.key,
      required this.width,
      required this.height,
      required this.color,
        this.imageBytes
      });

  @override
  Widget build(BuildContext context) {
    final headRadius = width * 0.36;
    final headMargin = width/2 - headRadius;

    DecorationImage? image;
    if(imageBytes!= null){
      image = DecorationImage(image: MemoryImage(imageBytes!));
    }else{
      image = const DecorationImage(image: AssetImage(Assets.imagesImDefaultHead), fit: BoxFit.fill);
    }

    return Stack(
      children: [
        SizedBox(
            width: width,
            height: height,
            child: CustomPaint(painter: _Painter(color))),
        Positioned(
          left: headMargin,
          top: headMargin,
          child: Container(
            width: headRadius*2,
            height: headRadius*2,
            decoration: BoxDecoration(
                border: Border.all(color: Colors.white, width: 0.25.wp),
                shape: BoxShape.circle,
                image: image,
            ),
          )
        )

      ],
    );
  }
}

class _Painter extends CustomPainter {
  _Painter(this.color);

  final Color color;
  final _paint = Paint();

  @override
  void paint(Canvas canvas, Size size) {
    final lineWidth = size.width * 0.04;
    draw(canvas, size, Colors.white, 0);
    draw(canvas, size, color, lineWidth);
  }

  void draw(Canvas canvas, Size size, Color color, double lineWidth) {
    _paint.color = color;
    _paint.style = PaintingStyle.fill;
    final radius = (size.width - lineWidth * 2) / 2;
    canvas.drawCircle(
        Offset(radius + lineWidth, radius + lineWidth), radius, _paint);

    final w = size.width / 3 - lineWidth * 2;

    final path = Path();
    var x = lineWidth;
    var y = lineWidth;
    x = (size.width - w) / 2;
    y += radius * 1.5;

    path.moveTo(x, y);
    x += w;
    path.lineTo(x, y);
    x = size.width / 2;
    y = size.height - lineWidth * 2;
    path.lineTo(x, y);
    path.close();
    canvas.drawPath(path, _paint);
  }

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

void main() {
  runPreview(Center(
      child: WidgetPoint(
    width: 140,
    height: 210,
    color: Colors.red,
  )));
}