How to crop image as a circle?

[ember11498]

I have asked this before but I got a vague response. After reading the example I still could not crop the image correctly as a circle. Can anyone point what how to have a circle editor crop layer that actually crops a circle?

class CircleEditorCropLayerPainter extends EditorCropLayerPainter {
const CircleEditorCropLayerPainter();

@override
void paintCorners(
    Canvas canvas, Size size, ExtendedImageCropLayerPainter painter) {
  final Paint paint = Paint()
    ..color = painter.cornerColor
    ..style = PaintingStyle.fill;
  final Rect cropRect = painter.cropRect;
  const double radius = 6;
  canvas.drawCircle(Offset(cropRect.left, cropRect.top), radius, paint);
  canvas.drawCircle(Offset(cropRect.right, cropRect.top), radius, paint);
  canvas.drawCircle(Offset(cropRect.left, cropRect.bottom), radius, paint);
  canvas.drawCircle(Offset(cropRect.right, cropRect.bottom), radius, paint);
}

@override
void paintMask(
    Canvas canvas, Size size, ExtendedImageCropLayerPainter painter) {
  final Rect rect = Offset.zero & size;
  final Rect cropRect = painter.cropRect;
  final Color maskColor = painter.maskColor;
  canvas.saveLayer(rect, Paint());
  canvas.drawRect(
      rect,
      Paint()
        ..style = PaintingStyle.fill
        ..color = maskColor);
  canvas.drawCircle(cropRect.center, cropRect.width / 2.0,
      Paint()..blendMode = BlendMode.clear);
  canvas.restore();
}

@override
void paintLines(
    Canvas canvas, Size size, ExtendedImageCropLayerPainter painter) {
  final Rect cropRect = painter.cropRect;
  if (painter.pointerDown) {
    canvas.save();
    canvas.clipPath(Path()..addOval(cropRect));
    super.paintLines(canvas, size, painter);
    canvas.restore();
  }
}
}

[rambozzang]

same problem here. plz~~

[Darkildo]

maybe you can use ClipRRect?

[zmtzawqlp]

you should handle the image data base on the crop rect, and setPixel to transparent out of the circular

    final imageBytes = await _image!.readAsBytes();
    img.Image originalImage = img.decodeImage(imageBytes)!;

    int size = originalImage.width > originalImage.height ? originalImage.height : originalImage.width;
    img.Image circularImage = img.Image(size, size);

    for (int y = 0; y < size; y++) {
      for (int x = 0; x < size; x++) {
        int centerX = size ~/ 2;
        int centerY = size ~/ 2;
        int radius = size ~/ 2;
        if (((x - centerX) * (x - centerX) + (y - centerY) * (y - centerY)) <= radius * radius) {
          int srcX = (x * originalImage.width / size).toInt();
          int srcY = (y * originalImage.height / size).toInt();
          circularImage.setPixel(x, y, originalImage.getPixel(srcX, srcY));
        } else {
          circularImage.setPixel(x, y, img.getColor(0, 0, 0, 0));  
        }
      }
    }