dart - 如何在 flutter 中截取屏幕外的小部件的屏幕截图？

Question

我正在使用 RepaintBoundary 截取当前小部件(listView)的屏幕截图。但它只捕获当时屏幕上可见的内容。

RepaintBoundary(
                key: src,
                child: ListView(padding: EdgeInsets.only(left: 10.0),
                  scrollDirection: Axis.horizontal,
                  children: <Widget>[
                    Align(
                        alignment: Alignment(-0.8, -0.2),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: listLabel(orientation),
                        )
                    ),

                    Padding(padding: EdgeInsets.all(5.0)),

                    Align(
                        alignment: FractionalOffset(0.3, 0.5),
                        child: Container(
                            height: orientation == Orientation.portrait? 430.0: 430.0*0.7,
                            decoration: BoxDecoration(
                                border: Border(left: BorderSide(color: Colors.black))
                            ),
                            //width: 300.0,
                            child:
                            Wrap(
                              direction: Axis.vertical,
                              //runSpacing: 10.0,
                              children: colWidget(orientation),
                            )
                        )
                    ),
                    Padding(padding: EdgeInsets.all(5.0)),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: listLabel(orientation),
                    )
                  ],
                ),
              );

截图功能:

Future screenshot() async {
    RenderRepaintBoundary boundary = src.currentContext.findRenderObject();
    ui.Image image = await boundary.toImage();
    ByteData byteData = await image.toByteData(format: ui.ImageByteFormat.png);
    Uint8List pngBytes = byteData.buffer.asUint8List();
    print(pngBytes);
    final directory = (await getExternalStorageDirectory()).path;
File imgFile =new File('$directory/layout2.pdf');
imgFile.writeAsBytes(pngBytes);
  }

有什么办法可以捕获整个 listView，即不仅是屏幕上不可见的内容，还有可滚动的内容。或者，如果整个小部件太大而不适合一张图片，则可以在多张图片中捕获它。

Answer 1

我使用这个包解决了这个问题:Screenshot ，它会截取整个小部件的屏幕截图。它简单易行，按照 PubDev 或 GitHub 上的步骤进行操作，您就可以让它工作。

OBS:要截取小部件的完整屏幕截图，请确保您的小部件完全可滚动，而不仅仅是其中的一部分。

(在我的例子中，我在 Container 中有一个 ListView，并且包没有截取所有 ListView 的屏幕截图，因为我有很多 itens，所以我将我的 Container 包装在 SingleChildScrollView 中并添加 NeverScrollableScrollPhysics ListView 中的物理学并且它有效!:D)。 Screenshot of my screen

More details in this issue