Fitting Image inside a circle using canvas flutter

668 Views Asked by At
final ui.PictureRecorder pictureRecorder = ui.PictureRecorder();
final Canvas canvas = Canvas(pictureRecorder);
final Paint paint = Paint()..color;
final double radius = size / 2;
final Path clipPath = Path();
clipPath.addRRect(RRect.fromRectAndRadius(
    Rect.fromLTWH(0, 0, size.toDouble(), size.toDouble()),
    Radius.circular(100)));
canvas.clipPath(clipPath);
final Uint8List imageUint8List =
    await (await NetworkAssetBundle(Uri.parse(src)).load(src))
        .buffer
        .asUint8List();
final ui.Codec codec = await ui.instantiateImageCodec(imageUint8List);
final ui.FrameInfo imageFI = await codec.getNextFrame();
paintImage(
    canvas: canvas,
    rect: Rect.fromLTWH(0, 0, size.toDouble(), size.toDouble()),
    image: imageFI.image);
if (addBorder) {
  //draw Border
  paint..color = borderColor;
  paint..style = PaintingStyle.stroke;
  paint..strokeWidth = borderSize;
  canvas.drawCircle(Offset(radius, radius), radius, paint);
}
final _image = await pictureRecorder
    .endRecording()
    .toImage(size, (size * 1.1).toInt());
final rdata = await _image.toByteData(format: ui.ImageByteFormat.png);

The code is as above. Granted I just learned about canvas today I have been trying to piece together code that will fit an image inside a circle to use as a marker for a map. The resultant image however looks like this:

Unfit Image

I need it to fit entirely.

1

There are 1 best solutions below

0
On

Adding

Fit:Boxfit.cover

to my paint image worked. Credits to @spazhead's comment.