CODEWITHSUNDEEP
flutterimage-processingdart
Andrew Dean
Andrew Dean

Reputation: 325

Flutter image processing causing pixelation

Working on a flutter project which needs to take photos and resize / crop images to 640 / 420 (15:10) before uploading to the server but they seem to be too lose too much quality and pixelated.

      img.Image image = img.decodeImage(a2);
      double width = (image.height / 10) * 15;
      image = img.copyCrop(image, ((image.width - width) / 2).round(), 0, width.round(), image.height);
      resized = img.encodeJpg(img.copyResize(image, width:640, interpolation: img.Interpolation.cubic));

currently using the camera to shoot at 720p (1280x720) and the image plugin for the crop and resize using average interpolation.

I'm mostly wondering if this is the best way to handle the image processing to keep the most quality or if there is a better method for this use case.

Upvotes: 2

Views: 2509

Answers (1)

Umair Jibran
Umair Jibran

Reputation: 483

you should try this method, I've been using the following method for myself and it works like charm, the image isn't losing any quality either and the size is way too compressed

final _tempDir = await getTemporaryDirectory();
    final _path = _tempDir.path;
    im.Image imageFile = im.decodeImage(_file.readAsBytesSync());
    mealID = Uuid().v4();
    final compressedImageFile = File('$_path/img_$mealID.jpg')
      ..writeAsBytesSync(im.encodeJpg(imageFile, quality: 80));
    setState(() {
      _file = compressedImageFile;
    });

the above method is for compressing image, and for capturing image from gallery/camera I'm using the method below.


  Future getImageFromCamera() async {
    Navigator.pop(context);
    var image = await ImagePicker.pickImage(
      source: ImageSource.camera,
      imageQuality: 50,
      /*you can set max height and/or width here as well just by setting value for maxHeight and/or maxWidth argument*/
    );
    setState(() {
      _file = image;
    });
    await compressImage();
  }

  Future getImageFromGallery() async {
    Navigator.pop(context);
    var image = await ImagePicker.pickImage(
      source: ImageSource.gallery,
      imageQuality: 50,
    );
    setState(() {
      _file = image;
    });
    await compressImage();
  }

Upvotes: 1

Related Questions