如何使图像选择器裁剪框圈？答案

【问题标题】：How to make image picker crop frame circle?如何使图像选择器裁剪框圈？
【发布时间】：2021-11-08 11:36:00
【问题描述】：

下面的照片是我想要裁剪的方式。但我只看到如何裁剪成矩形。请原谅我的写作格式。这是我第一次询问堆栈溢出问题。这是我的图片裁剪代码

Future<File> cropSquareImage(File imageFile) async =>
      await ImageCropper.cropImage(
        sourcePath: imageFile.path,
        aspectRatio: CropAspectRatio(ratioX: 1, ratioY: 1),
        aspectRatioPresets: [CropAspectRatioPreset.square],
        compressQuality: 70,
        compressFormat: ImageCompressFormat.jpg,
        androidUiSettings: androidUiSettingsLocked(),
        iosUiSettings: iosUiSettingsLocked(),
      );

照片记录

【问题讨论】：

“但我只看到如何裁剪成矩形。” - 然后发布代码
@pskink 抱歉我已编辑
你有 CropStyle 可以使用的枚举

标签： flutter flutter-image

【解决方案1】：

使用“border-radius”属性使裁剪元素成为圆形，并使用相同的border-radius 属性显示它。图像仍然是一个矩形，在这种情况下是一个正方形，但是如果将其裁剪为圆形并显示为圆形，则用户只能看到圆形图像裁剪。

没有（合理的）方法可以实际存储具有半径而不是 YYY x ZZZ 像素分辨率的图像文件。

【讨论】：

这很完美。但我还有另一个问题。裁剪后，即使我将Compressed Quality设置为100，图像质量仍然很低。
我不知道“压缩质量”是什么，但是如果您要显示图像，然后将其裁剪为较小的图像，并以与原始图像相同的尺寸显示新的较小图像较大的图像，新的图像将被拉伸以适应大小并显得模糊/有颗粒感。

【解决方案2】：

如果您使用 image_cropper，您只需将属性 cropStyle 设置为 CropStyle.circle ImageCropper.cropImage(cropStyle: CropStyle.circle);

【讨论】：