listview_screenshot 2.1.0

Supports long screenshots, suitable for ListView and other scrollable widgets,

listview_screenshot

flutter全平台针对ListView等滚动视图实现长截图，

Getting started

dart pub add listview_screenshot

Usage

列表截图示例

核心是 WidgetShotRenderRepaintBoundary.screenshot

  final GlobalKey _shotKey = GlobalKey();
  final ScrollController _scrollController = ScrollController();

        child: WidgetShot(
          key: _shotKey,
          child: ListView.builder(
            controller: _scrollController,
            // ...
          ),
        ),

  void onScreenshot() async {
    EasyLoading.show(status: '正在创建截图，请勿操作');
    var context = _shotKey.currentContext!;
    WidgetShotRenderRepaintBoundary repaintBoundary =
        context.findRenderObject() as WidgetShotRenderRepaintBoundary;
    Uint8List pngBytes;
    try {
      pngBytes = await repaintBoundary.screenshotPng( // 或者调用screenshotImage得到image库的Image对象，
        scrollController: _scrollController,
        backgroundColor: Colors.white,
        workerName: 'imageMergeTransform', // web异步线程合并要生成对应js文件，否则不传，
        onProcess: (p0, p1) {
          if (p0 == 0) {
            EasyLoading.show(status: '正在合并截图，请勿操作');
          } else {
            EasyLoading.showProgress(p0 / p1, status: '正在创建截图，请勿操作, $p0/$p1');
          }
        },
      );
    } catch (e) {
      EasyLoading.dismiss();
      EasyLoading.showError('生成截图失败: ${e.toString()}');
      return;
    }
    EasyLoading.show(status: '正在保存长截图...');
    // ... save pngBytes to png file,
  }

web异步线程合并支持，
imageMergeTransform.dart 下载到flutter项目web目录下，使用如下代码编译出js文件，
生成的js文件名填写到screenshot方法参数workerName，
同时生成的js.deps和js.map文件仅调试使用，不必须，

dart compile js imageMergeTransform.dart -o imageMergeTransform.js -O4

TODO

• mac HiDPI截不到高清图，