我必须对一个很大的小部件进行筛选,他不适合屏幕大小,所以我使用了InteractiveView。该小部件是图形视图包中的图表。
问题是,我必须对这个小部件进行截图。
我使用了RepaintBoundary小部件和Screenshot pub软件包,但是我遇到了同样的问题,我只能截取屏幕上部件的一部分,而不能截取屏幕外部分的组件。
我该如何截取整个小部件?
我的代码:
Scaffold(
body: state.graphInfo.isNotEmpty
? RepaintBoundary(
key: screen,
child: InteractiveViewer(
constrained: false,
boundaryMargin: const EdgeInsets.all(100),
minScale: 0.01,
maxScale: 4,
child: Column(
children: [
SizedBox(
width: newList.length.toDouble() * 160 + 200,
height: 150,
child: Container(
alignment: Alignment.center,
child: ListView.separated(
shrinkWrap: true,
scrollDirection: Axis.horizontal,
separatorBuilder:
(BuildContext context, int index) {
return const SizedBox(
width: 40,
);
},
itemCount: newList.length,
physics: const NeverScrollableScrollPhysics(),
itemBuilder: (context, index) {
return SizedBox(
height: 300,
width: 150,
child: Center(
child: Padding(
padding: const EdgeInsets.only(
right: 8.0, left: 8.0),
child: Text(
newList[index],
overflow: TextOverflow.clip,
textAlign: TextAlign.center,
),
),
),
);
},
),
),
),
GraphView(
graph: GetGraph.getGraph(state.graphInfo,
state.checkList, state.totalPatient),
algorithm: BuchheimWalkerAlgorithm(
builder, TreeEdgeRenderer(builder)),
builder: (Node node) {
var a = node.key!.value["label"].round();
return circleWidget(a, state.totalPatient);
},
),
],
),
),
)
: const Center(
child: Text("Aucune donnée."),
),
floatingActionButton: state.graphInfo.isNotEmpty
? FloatingActionButton(
child: const Icon(Icons.screenshot_monitor),
onPressed: () async {
RenderRepaintBoundary boundary = screen.currentContext!
.findRenderObject() as RenderRepaintBoundary;
ui.Image image = await boundary.toImage();
final byteData =
await image.toByteData(format: ui.ImageByteFormat.png);
final file = File("${state.output_file}/aller.png");
await file.writeAsBytes(byteData!.buffer.asUint8List());
},
)
: null,
);