flutter - 如何将插入文本表单字段的文本转换为 flutter 中的图像？

Question

我有 Textformfield，用户可以在其中输入文本，然后点击按钮，我想将插入的文本转换为图像并将其显示在其他屏幕上。

任何帮助将不胜感激。

我尝试使用第三方 screenshot包，但我想要它没有第三方包或 API

Answer 1

您可以通过查找小部件的 RenderObject 并将其转换为图像来获取某些小部件的图像。然后你可以将这张图片保存在状态中并在其他地方使用。

下面是一个例子:

class _HomeState extends State<Home> {
  final GlobalKey _globalKey = GlobalKey();
  Widget? _image;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          if (_image != null) _image!,
          RepaintBoundary(
            key: _globalKey,
            child: TextField(),
          ),
          TextButton(
            onPressed: () async {
              final boundary = _globalKey.currentContext?.findRenderObject();
              if (boundary is RenderRepaintBoundary) {
                final uiimage = await boundary.toImage();
                final pngBytes = await uiimage.toByteData(format: ImageByteFormat.png);

                setState(() {
                  _image = Image.memory(
                      Uint8List.view(pngBytes!.buffer)
                  );
                });
              }
            },
            child: Text('Cheese'),
          )
        ],
      ),
    );
  }
}