如何在图像上组合文本小部件答案

【问题标题】：How can i combine text widget over the image如何在图像上组合文本小部件
【发布时间】：2022-09-23 18:01:05
【问题描述】：

这是我的一些过程

1- 我正在使用image_picker 从图库中挑选图像

2-我使用Image.file 小部件显示它

3-我将Image.file 包装成stack widget 并将文本放在中心，如下所示

                    Stack(
                    alignment: Alignment.center,
                    children: [
                      Image.file(
                        File(myImage),
                        fit: BoxFit.cover,
                        height: double.infinity,
                        width: double.infinity,
                      ),
                      const Text(\'Hello world\')
                    ],
                  ),

4-然后使用firebase_storage将图像上传到服务器

现在的问题

我怎样才能用我的Text(\'Hello world\') 上传我的图片
在另一个世界：如何将文本作为图像的一部分

有什么插件吗？

我应该寻找什么？

你可以用文件名和你想要的文本制作一个对象，然后制作一个 json 将其上传到服务器

标签： flutter dart

【解决方案1】：

您可以使用screenshot 包，并截取堆栈小部件的屏幕截图并将screenshot image 发送到您的服务器。像这样：

ScreenshotController screenshotController = ScreenshotController();

Screenshot(
    controller: screenshotController,
    child: Stack(
                    alignment: Alignment.center,
                    children: [
                      Image.file(
                        File(myImage),
                        fit: BoxFit.cover,
                        height: double.infinity,
                        width: double.infinity,
                      ),
                      const Text('Hello world')
                    ],
                  ),
),

你可以得到这样的图像：

screenshotController.capture().then((Uint8List image) {
    //Capture Done
    setState(() {
        _imageFile = image;
    });
}).catchError((onError) {
    print(onError);
});

这里 _imageFile 是 Uint8List ，您可以将 _imageFile 发送到您的服务器。

【讨论】：