Flutter：如何使用“多图像选择器”来降低图像质量并将输出作为“文件”？

Question

我正在使用 Flutter 包来多选图像。 下面是我的代码

List<Asset>localAssetList = [];//new

localAssetList = await MultiImagePicker.pickImages(
        maxImages: 5,
        enableCamera: true,
        
       selectedAssets: localAssetList,
        cupertinoOptions: CupertinoOptions(takePhotoIcon: "chat"),
        materialOptions: MaterialOptions(
          actionBarColor: "#abcdef",
          actionBarTitle: "Example App",
          allViewTitle: "All Photos",
          useDetailsView: false,
          selectCircleStrokeColor: "#000000",
        ),
      );

我想将每张图像的图像质量降低 60%，然后将结果作为List<File> 。 我怎样才能做到这一点？

Answer 1

您可以执行以下操作：

  _getImageList() async {
    var resultList = await MultiImagePicker.pickImages(
      maxImages: 6,
      enableCamera: true,
    );

    // The data selected here comes back in the list
    for (var imageFile in resultList) {
      await postImage(imageFile).then((downloadUrl) {
        // Get the download URL and do your stuff here
      }).catchError((err) {
        print(err);
      });
    }
  }

在 postImage 函数中，您可以调整每个图像的大小并更改其质量。

Future<dynamic> postImage(Asset imageFile) async {
    double imageDesiredWidth = 500;

    double getAspectRatio(double originalSize, double desiredSize) => desiredSize / originalSize;
    final aspectRatio = getAspectRatio(imageFile.originalWidth.toDouble(), imageDesiredWidth);
    ByteData byteData = await imageFile.getThumbByteData(
        (imageFile.originalWidth * aspectRatio).round(),
        (imageFile.originalHeight * aspectRatio).round(),
        quality: 85
    );

    String fileName = DateTime
        .now()
        .millisecondsSinceEpoch
        .toString();
    StorageReference reference = _storage.ref().child(fileName);
    StorageUploadTask uploadTask =
    reference.putData(byteData.buffer.asUint8List());
    StorageTaskSnapshot storageTaskSnapshot = await uploadTask.onComplete;
    return await storageTaskSnapshot.ref.getDownloadURL();
  }

Answer 2

在这种情况下，您可以使用一个不错的库：flutter_image_compress。

首先添加依赖：

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^0.1.3
  flutter_image_compress: ^0.7.0

导入它

import 'package:flutter_image_compress/flutter_image_compress.dart';

对于使用它，您可以使用以下方法：

void compressImage(File file) async {
    // Get file path
    // eg:- "Volume/VM/abcd.jpeg"
    final filePath = file.absolute.path;
    
    // Create output file path
    // eg:- "Volume/VM/abcd_out.jpeg"
    final lastIndex = filePath.lastIndexOf(new RegExp(r'.jp'));
    final splitted = filePath.substring(0, (lastIndex));
    final outPath = "${splitted}_out${filePath.substring(lastIndex)}";

    final compressedImage = await FlutterImageCompress.compressAndGetFile(
          filePath, 
          outPath,
          minWidth: 1000,
          minHeight: 1000,
          quality: 70);
}

您可以在此处找到有关 Flutter Image Compress 的更多信息： https : //pub.dev/packages/flutter_image_compress 。 如果这能解决您的问题，请告诉我。

Answer 3

首先，不推荐使用multi_image_picker 。 使用multi_image_picker2 。

截至 2021 年 10 月，有两种方法可以做到这一点。

第一种方式

使用flutter_image_compress库如下。 这里我使用的是Uint8List但您也可以使用File 。

Future<Uint8List> compressUintImage(Uint8List list) async {
    var result = await FlutterImageCompress.compressWithList(
      list,
      minHeight: 1920,
      minWidth: 1080,
      quality: 96,
    );
    print(list.length);
    print(result.length);
    return result;
  }

第二种方式

ByteData byteData = await file.getByteData(quality: 100);

这是通过使用multi_image_picker2本身。 这里的file是一个Asset 。