Question

我正在使用Flutter构建演示墙纸应用程序，用户可以在其中将图像上传到Firebase。加载这些图像时，我首先要加载图像的较小版本，并且只有在用户单击图像后才加载完整版本。为了实现这一点，我认为一旦用户选择了图像，我就会在后台简单地上传2个版本。现在，我正在努力实现这一目标。

这是用户使用ImagePicker将图像拾取到文件var中的方式。

Future pickImage() async {
var tempImage = await ImagePicker.pickImage(source: ImageSource.gallery, maxHeight: 2000);
print(tempImage.runtimeType);


setState(() {
  inspirationimage = tempImage;
});
String result = await uploadImage();
}

如您所见，tempimage是完整尺寸的版本。我现在会像这样：

var smallImage = tempImage.resize(height: 200);

显然，这不起作用，因为tempImage是文件类型。任何想法通常如何解决？

谢谢

Answer 1

由于您使用的是Firebase，因此可以使用Firebase "Resize Image" extension。但是，如果要在客户端执行此操作，请查看this answer。

Answer 2

您为什么不让用户使用此图像来裁剪图像 image_cropper 1.3.1插件？链接：https://pub.dev/packages/image_cropper

示例

// File image = await ImagePicker.pickImage(source: source);
    final _picker = ImagePicker();
    PickedFile image = await _picker.getImage(source: source);
    if (image != null) {
      // Remove crop attribute if we don't want to resize the image
      File cropped = await ImageCropper.cropImage(
        sourcePath: image.path,
        aspectRatio: CropAspectRatio(ratioX: 1, ratioY: 1),
        compressQuality: 100, // 100 means no compression
        maxWidth: 700, 
        maxHeight: 700,
        compressFormat: ImageCompressFormat.jpg,
        androidUiSettings: AndroidUiSettings(
          toolbarColor: primaryColor,
          toolbarTitle: "RPS Cropper",
          statusBarColor: primaryColor,
          backgroundColor: Colors.white,
          //toolbarWidgetColor: primaryColor,
          activeControlsWidgetColor: primaryColor,
          //dimmedLayerColor: primaryColor,
          cropFrameColor: primaryColor,
          cropGridColor: primaryColor,
        ),
      );

在上载到Firebase之前先调整图像的大小

2 个答案: