使用Extend_image flutter包（8.2.0），无法从Android手机上编辑的图像中获取Uint8List数据

Question

我正在使用 flutter 包extend_image 来编辑图像。

图像的加载和编辑在屏幕上完美（视觉）工作

状态变量：

final GlobalKey<ExtendedImageEditorState> editorKey = GlobalKey<ExtendedImageEditorState>();
late ExtendedImage img;

负载：

img = ExtendedImage.file(
      File(widget.filePath),
      fit: BoxFit.contain,
      mode: ExtendedImageMode.editor,
      extendedImageEditorKey: editorKey,
      cacheRawData: true,
      initEditorConfigHandler: (state) => EditorConfig(
        maxScale: 8.0,
        cropRectPadding: EdgeInsets.all(20.0),
        hitTestSize: 20.0,
      ),
    );

编辑

editorKey.currentState?.flip();
// or
editorKey.currentState?.rotate();

获取数据进行保存（作为图像提供者）：

ImageProvider<Object> ip = img.image;
Uint8List? editedImageFromProvider = await getImageFromImageProvider(ip);

Future<Uint8List?> getImageFromImageProvider(ImageProvider provider) async {
    final ImageStream stream = provider.resolve(ImageConfiguration.empty);
    Completer<Uint8List?> completer = Completer<Uint8List?>();
    ImageStreamListener? listener;

    listener = ImageStreamListener(
      (ImageInfo info, bool synchronousCall) {
        final Future<ByteData?> byteData = info.image.toByteData(format: ImageByteFormat.png);
        byteData.then((value) {
          if (value != null) {
            completer.complete(value.buffer.asUint8List());
          } else {
            completer.complete(null);
          }
        });
        // Remove the listener once the image data is fetched
        stream.removeListener(listener!);
      },
      /*onError: (dynamic error, StackTrace stackTrace) {
        print('Error occurred while loading image: $error');
        completer.complete(null);
        stream.removeListener(listener!);
      }*/
    );

    stream.addListener(listener);
    return completer.future;
  }

使用更简单的原始图像逻辑

Uint8List? editedImageFromRaw = await getImageFromRaw(img);

Future<Uint8List?> getImageFromRaw(ExtendedImage image) async {
    final state = editorKey.currentState;
    if (state == null) {
      return null;
    }
    Uint8List result = await state.rawImageData;

    return result;
  }

使用这两种方法，我都会返回相同的 Uint8List，这是加载的原始图像中的 Uint8List...通过多次编辑（.roatate()、crop、flip()），返回的数据保持不变...

我也尝试删除

cacheRawData: true

来自负载，因为它认为这可能会迫使不良回报。这会阻止 state.rawImageData 工作，但图像提供程序仍然工作并在每次编辑后返回相同的字节码。

看起来好像所有调用都是针对原始加载的图像而不是针对编辑后的图像。

我应该注意到，编辑显然是有效的并且在屏幕上可见，因此唯一的问题是获取我可以看到的图像的原始数据回到代码。

谢谢...

Answer 1

软件包的开发人员给我回复了解决方案...

为了从编辑器中获得编辑，我需要使用以下代码。

Future<Uint8List?> getImageFromNew() async {
    final state = editorKey.currentState;
    if (state == null || state.image == null) {
      return null;
    }
    Rect cropRect = state.getCropRect()!;
    if (state.widget.extendedImageState.imageProvider is ExtendedResizeImage) {
      final ImmutableBuffer buffer = await ImmutableBuffer.fromUint8List(state.rawImageData);
      final ImageDescriptor descriptor = await ImageDescriptor.encoded(buffer);

      final double widthRatio = descriptor.width / state.image!.width;
      final double heightRatio = descriptor.height / state.image!.height;
      cropRect = Rect.fromLTRB(
        cropRect.left * widthRatio,
        cropRect.top * heightRatio,
        cropRect.right * widthRatio,
        cropRect.bottom * heightRatio,
      );
    }
    final EditActionDetails action = state.editAction!;
    final int rotateAngle = action.rotateAngle.toInt();
    final bool flipHorizontal = action.flipY;
    final bool flipVertical = action.flipX;

    final Uint8List imgl = state.rawImageData;

    final ImageEditorOption option = ImageEditorOption();

    if (action.needCrop) {
      option.addOption(ClipOption.fromRect(cropRect));
    }

    if (action.needFlip) {
      option.addOption(FlipOption(horizontal: flipHorizontal, vertical: flipVertical));
    }

    if (action.hasRotateAngle) {
      option.addOption(RotateOption(rotateAngle));
    }

    final Uint8List? result = await ImageEditor.editImage(
      image: imgl,
      imageEditorOption: option,
    );
    return result;
  }

这非常有效！