Как сделать снимок ТОЛЬКО изображения внутри renderObject без окружающих пространств во Flutter?

Question

Изображение было создано с использованием CustomPaint, имеющего холст квадратной формы, например:

_imagePaint = CustomPaint(
      size: Size(width, width),
      painter: imagePainter(image: image),
    );

Я поместил изображение в RepaintBoundary следующим образом:

Container(
   height: Device.screenHeight * 0.56,
   child: RepaintBoundary(
      key: imageAreaKey,
      child: imagePaint,
   ), // RepaintBoundary
), // Container

Затем я захватываю изображение следующим образом:

// Getting the render object that contains the image on screen
final RenderRepaintBoundary boundary = imageAreaKey.currentContext.findRenderObject();

// Capturing the image inside the render object
final image = await boundary.toImage(pixelRatio: pixelRatio);

// Converting the image into ByteData
final byteData = await image.toByteData(format: ui.ImageByteFormat.png);

return byteData.buffer.asUint8List();

Но результат показывает, что вокруг изображения есть несколько прозрачных пространств. Это особенно заметно, когда я конвертирую в формат JPG, который превращает прозрачные пространства в черный цвет.

См. Рисунок ниже. Обратите внимание на черные пятна сверху и снизу изображения. Как сделать снимок только изображения без пробелов в первый раз?

Если это невозможно, то как мне избавиться от него, несмотря на множество разных размеров экрана?

Примечание : Исходное изображение представляет собой идеальный квадрат

введите описание изображения здесь

Answer 1

Вы можете попробовать сделать Container s height равным ширине устройства.

Container(
   height: Device.screenWidth,
   child: RepaintBoundary(
      key: imageAreaKey,
      child: imagePaint,
   ), // RepaintBoundary
),