developed

lib/application/order_detail_bloc/order_detail_bloc.dart

@@ -2,12 +2,11 @@ import 'dart:async';
 
 import 'package:another_stepper/another_stepper.dart';
 import 'package:cargo/core/constants/colors.dart';
+import 'package:collection/collection.dart';
 import 'package:equatable/equatable.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
-import 'package:collection/collection.dart';
 
-import '../../core/constants/assets.dart';
 import '../../core/errors/failures.dart';
 import '../../domain/entities/route/route.dart';
 import '../../domain/usecases/order/get_routes_usecase.dart';
@@ -74,12 +73,15 @@ class OrderDetailBloc extends Bloc<OrderDetailEvent, OrderDetailState> {
                     ),
                   ),
                   iconWidget: isSplashedIcon
-                      ? Image.asset(
+                      ? CircleWithGapWidget(
-                          AppAssets.circle,
+                          radius: 7,
-                          color: iconColor,
+                          fillColor: iconColor,
+                          borderColor: iconColor,
+                          borderWidth: 2,
+                          gap: 3.0,
                         )
                       : CirclePainterWidget(
-                          radius: 8,
+                          radius: 9,
                           color: iconColor,
                         ),
                 );

lib/core/constants/assets.dart

@@ -10,8 +10,6 @@ sealed class AppAssets {
   static const String boxesPng = 'assets/images/boxes.png';
   static const String trucksPng = 'assets/images/trucks.png';
   static const String header = 'assets/images/header.png';
-  static const String circle = 'assets/images/circle.png';
-  static const String circle2 = 'assets/images/circle2.png';
   static const String search = 'assets/images/search.png';
   static const String searchGif = 'assets/images/search.gif';
 }

lib/presentation/widgets/circle_painter.dart

@@ -42,3 +42,86 @@ class CirclePainterWidget extends StatelessWidget {
     );
   }
 }
+
+class CircleWithGapPainter extends CustomPainter {
+  final double radius;
+  final Color fillColor;
+  final Color borderColor;
+  final double borderWidth;
+  final double gap;
+
+  CircleWithGapPainter({
+    required this.radius,
+    required this.fillColor,
+    required this.borderColor,
+    required this.borderWidth,
+    required this.gap,
+  });
+
+  @override
+  void paint(Canvas canvas, Size size) {
+    // Paint for the inner circle
+    final fillPaint = Paint()
+      ..color = fillColor
+      ..style = PaintingStyle.fill;
+
+    // Paint for the border
+    final borderPaint = Paint()
+      ..color = borderColor
+      ..style = PaintingStyle.stroke
+      ..strokeWidth = borderWidth;
+
+    // Draw the filled inner circle
+    canvas.drawCircle(
+      Offset(size.width / 2, size.height / 2),
+      radius,
+      fillPaint,
+    );
+
+    // Draw the border circle with the gap
+    canvas.drawCircle(
+      Offset(size.width / 2, size.height / 2),
+      radius + gap + borderWidth / 2,
+      borderPaint,
+    );
+  }
+
+  @override
+  bool shouldRepaint(covariant CustomPainter oldDelegate) {
+    return false;
+  }
+}
+
+class CircleWithGapWidget extends StatelessWidget {
+  final double radius;
+  final Color fillColor;
+  final Color borderColor;
+  final double borderWidth;
+  final double gap;
+
+  const CircleWithGapWidget({
+    super.key,
+    required this.radius,
+    required this.fillColor,
+    required this.borderColor,
+    required this.borderWidth,
+    required this.gap,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    // Ensure the widget is large enough to fit the circle with its border and gap
+    double totalSize = (radius + gap + borderWidth) * 2;
+
+    return CustomPaint(
+      painter: CircleWithGapPainter(
+        radius: radius,
+        fillColor: fillColor,
+        borderColor: borderColor,
+        borderWidth: borderWidth,
+        gap: gap,
+      ),
+      size: Size(totalSize, totalSize),
+    );
+  }
+}