Flutter web：将 RenderRepaintBoundary 更改为图像时出错

Question

当我使用 RepaintBoundary 小部件并将其更改为图像时，出现此错误

final boundary = _repaintBoundaryKey.currentContext?.findRenderObject()
        as RenderRepaintBoundary?;
    final image = await boundary?.toImage(); 

Error: Assertion failed: org-dartlang-sdk:///flutter_web_sdk/lib/_engine/engine/html/scene_builder.dart:94:16
matrix4[0] == window.devicePixelRatio &&
            matrix4[5] == window.devicePixelRatio

我发现这个错误的原因是

final image = await boundary?.toImage();

如何解决这个问题？

Answer 1

是的，我在 Github 上找到了这个，但忘记关闭它了。 只需使用

flutter build web --web-renderer canvaskit

进行构建即可。

Answer 2

似乎 .toImage() 尚未在网络上实现！ GitHub问题

但也许你可以尝试使用canvakit渲染器运行你的代码：

flutter run -d chrome --web-renderer=canvaskit

Answer 3

我使用这个包在网络中获取图像Screenshot

import 'package:screenshot/screenshot.dart';


Screenshot(
          controller: screenshotController,
          child: Container(), //your widget
)

ontap: (){
 print("Saving image on Web");
    Uint8List? image;
    await screenshotController
        .capture(delay: Duration(milliseconds: 1))
        .then((capturedImage) async {
      image = capturedImage;
      setState(() {});
      if (image != null) {
        //save your image here
      }
    }).catchError((onError) {
      print(onError);
    });
}