How I can insert image inside the slider thumb flutter

Question

I have this code:

class _BSliderState extends State<BSlider> with SingleTickerProviderStateMixin {
  @override
  Widget build(BuildContext context) {
    return Container(
      color: AppColors.greyColor.withOpacity(0.3),
      child: Padding(
        padding: const EdgeInsets.only(
            left: Dimension.paddingM,
            right: Dimension.paddingM,
            top: Dimension.paddingS,
            bottom: Dimension.paddingM),
        child: Stack(
          children: [
            Container(
              height: 68,
              decoration: const BoxDecoration(
                  color: AppColors.primaryColorDark,
                  borderRadius: BorderRadius.all(
                      Radius.circular(Dimension.borderRadiusAll))),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: const [
                  Padding(
                    padding: EdgeInsets.only(left: Dimension.padding),
                    child: Text(
                      'Start',
                      style: TextStyle(
                          color: AppColors.white,
                          fontSize: 20,
                          fontWeight: FontWeight.w500),
                    ),
                  ),
                  Padding(
                    padding: EdgeInsets.only(right: Dimension.padding),
                    child: Text(
                      'End',
                      style: TextStyle(
                          color: AppColors.white,
                          fontSize: 20,
                          fontWeight: FontWeight.w500),
                    ),
                  ),
                ],
              ),
            ),
            Padding(
              padding: const EdgeInsets.symmetric(
                  vertical: Dimension.paddingXS,
                  horizontal: Dimension.paddingXS),
              child: SliderTheme(
                data: SliderThemeData(
                    thumbColor: AppColors.primaryColorLight,
                    trackHeight: 0,
                    thumbShape: RoundSliderThumbShape()),
                child: Slider(
                  onChangeEnd: (value) {
                    if (value > 0.95) {
                      setState(() {
                        sliderValue = 1;
                      });
                    } else if (value < 0.1) {
                      setState(() {
                        sliderValue = 0;
                      });
                    } else {
                      setState(() {
                        sliderValue = 0.5;
                      });
                    }
                    print(value);
                  },
                  value: sliderValue,
                  onChanged: (value) {
                    setState(() {
                      sliderValue = value;
                    });
                  },
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}

class RoundSliderThumbShape extends SliderComponentShape {
  const RoundSliderThumbShape({
    this.enabledThumbRadius = 30.0,
    this.disabledThumbRadius,
    this.elevation = 0,
    this.pressedElevation = 6.0,
  });

  final double enabledThumbRadius;
  final double? disabledThumbRadius;
  double get _disabledThumbRadius => disabledThumbRadius ?? enabledThumbRadius;
  final double elevation;
  final double pressedElevation;

  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
    return Size.fromRadius(
        isEnabled == true ? enabledThumbRadius : _disabledThumbRadius);
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
    required Animation<double> activationAnimation,
    required Animation<double> enableAnimation,
    required bool isDiscrete,
    required TextPainter labelPainter,
    required RenderBox parentBox,
    required SliderThemeData sliderTheme,
    required TextDirection textDirection,
    required double value,
    required double textScaleFactor,
    required Size sizeWithOverflow,
  }) {
    assert(context != null);
    assert(center != null);
    assert(enableAnimation != null);
    assert(sliderTheme != null);
    assert(sliderTheme.disabledThumbColor != null);
    assert(sliderTheme.thumbColor != null);

    final Canvas canvas = context.canvas;
    final Tween<double> radiusTween = Tween<double>(
      begin: _disabledThumbRadius,
      end: enabledThumbRadius,
    );
    final ColorTween colorTween = ColorTween(
      begin: sliderTheme.disabledThumbColor,
      end: sliderTheme.thumbColor,
    );

    final Color color = colorTween.evaluate(enableAnimation)!;
    final double radius = radiusTween.evaluate(enableAnimation);

// Use drawCircle to draw a circular shape
    canvas.drawCircle(center, radius, Paint()..color = color);
  }
}

I want to insert inside the blu container an image. I prefer String image path. I don't want use a external plugin because it's not very customizable like this. as you can see it is a sort of bidirectional swipe which goes back (i.e. to the center) if it does not meet certain conditions.

I didn't find any suggestions online.

Someone can help me?