How do I save a CameraImage to an image file?

Issue

I developed a mobile application with flutter. I do object detection use "controller.startImageStream" this method return CameraImage and i use with object detection. I want to save this image file. I tried to convert this file to List and jpg file for save. But uint8list could not converted to List. Is this structure a true way? If you know different solutions for my problem, please share me.

This is my video streaming method ;

startVideoStreaming() {
    if (cameras == null || cameras.length < 1) {
      print('No camera is found');
    } else {
      controller = new CameraController(
        cameras[0],
          ResolutionPreset.medium,
        );

        if(!_busy){
          controller.initialize().then((_) {

          print("model yükleme bitmiş stream dinleme başlıyor ");

          controller.startImageStream((CameraImage img){
                  print("img format: ${img.format} planes: ${img.planes}");
                  List<int> imageBytes = [];
                  img.planes.map((plane) {
                    imageBytes.addAll(plane.bytes.toList());
                  });
                  
                  // call save image file method
                    saveImageFile(imageBytes).then((res) => {
                      print("save image file successfull filepath: $res")
                    }).catchError((err) => {
                      print("error on save image file error: $err")
                    });
                  
                  if(!isDetecting){
                    isDetecting = true;
                    print("Tflite'a stream gönderildi");
                    Tflite.detectObjectOnFrame(
                        bytesList: img.planes.map((plane) {
                          return plane.bytes;
                        }).toList(),
                        model: "SSDMobileNet",
                        imageHeight: img.height,
                        imageWidth: img.width,
                        imageMean: 127.5,
                        imageStd: 127.5,
                        numResultsPerClass: 1,
                        threshold: 0.4,
                      ).then((recognitions) {
                        int endTime = new DateTime.now().millisecondsSinceEpoch;
                        setState(() {
                          _recognitions=recognitions;
                        });
                        print("Recognitions: $recognitions");
                        isDetecting = false;
                      });
                  }
                });
          });
        }
    }
  }

This is my image save method ;

Future<String> saveImageFile(imageBytes) async {
    final Directory extDir = await getApplicationDocumentsDirectory();
    final String dirPath = '${extDir.path}/Pictures/flutter_test';
    await Directory(dirPath).create(recursive: true);
    final String filePath = '$dirPath/${timestamp()}.jpg';

    if (controller.value.isTakingPicture) {
      // A capture is already pending, do nothing.
      return null;
    }

    try {
      File file = new File(filePath);
      file.writeAsBytes(imageBytes);
      print("finish image saved $imageBytes");
    } on CameraException catch (e) {
      _showCameraException(e);
      return null;
    }
    return filePath;
  }

Solution

You can convert CameraImage YUV420 or BGRA8888 to image with the following code snippet

code from gist : https://gist.github.com/Alby-o/fe87e35bc21d534c8220aed7df028e03

// imgLib -> Image package from https://pub.dartlang.org/packages/image
import 'package:image/image.dart' as imglib;
import 'package:camera/camera.dart';

Future<List<int>> convertImagetoPng(CameraImage image) async {
  try {
    imglib.Image img;
    if (image.format.group == ImageFormatGroup.yuv420) {
      img = _convertYUV420(image);
    } else if (image.format.group == ImageFormatGroup.bgra8888) {
      img = _convertBGRA8888(image);
    }

    imglib.PngEncoder pngEncoder = new imglib.PngEncoder();

    // Convert to png
    List<int> png = pngEncoder.encodeImage(img);
    return png;
  } catch (e) {
    print(">>>>>>>>>>>> ERROR:" + e.toString());
  }
  return null;
}

// CameraImage BGRA8888 -> PNG
// Color
imglib.Image _convertBGRA8888(CameraImage image) {
  return imglib.Image.fromBytes(
    image.width,
    image.height,
    image.planes[0].bytes,
    format: imglib.Format.bgra,
  );
}

// CameraImage YUV420_888 -> PNG -> Image (compresion:0, filter: none)
// Black
imglib.Image _convertYUV420(CameraImage image) {
  var img = imglib.Image(image.width, image.height); // Create Image buffer

  Plane plane = image.planes[0];
  const int shift = (0xFF << 24);

  // Fill image buffer with plane[0] from YUV420_888
  for (int x = 0; x < image.width; x++) {
    for (int planeOffset = 0;
        planeOffset < image.height * image.width;
        planeOffset += image.width) {
      final pixelColor = plane.bytes[planeOffset + x];
      // color: 0x FF  FF  FF  FF
      //           A   B   G   R
      // Calculate pixel color
      var newVal = shift | (pixelColor << 16) | (pixelColor << 8) | pixelColor;

      img.data[planeOffset + x] = newVal;
    }
  }

  return img;
}

Answered By – chunhunghan

Answer Checked By – Mildred Charles (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.