是否可以在 Flutter 中从文本创建图像？

Question

我正在开发一个应用程序，用户可以登录该应用程序并可以在文本表单字段中输入文本。它还可以应用不同的字体样式和字体系列并从中生成图像。

有可能实现吗？

任何帮助将不胜感激

Answer 1

这是给您的一个例子。您可以在应用程序中对其进行测试。
它将文本绘制到画布上，然后将画布保存为图像。因此您可以将任何字体样式应用于 ParagraphBuilder。

我希望它有帮助

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  TextEditingController controller = TextEditingController();
  Image? img;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
            TextFormField(
              controller: controller,
            ),
            ElevatedButton(onPressed: _onPressedButton, child: const Text("Create Image")),
            Container(width: 200, height: 200, color: Colors.blueGrey, child: img ?? Container())
          ],
        ),
      ),
    );
  }

  void getCanvasImage(String str) async {
    var builder = ParagraphBuilder(ParagraphStyle(fontStyle: FontStyle.normal));
    builder.addText(str);
    Paragraph paragraph = builder.build();
    paragraph.layout(const ParagraphConstraints(width: 100));

    final recorder = PictureRecorder();
    var newCanvas = Canvas(recorder);

    newCanvas.drawParagraph(paragraph, Offset.zero);

    final picture = recorder.endRecording();
    var res = await picture.toImage(100, 100);
    ByteData? data = await res.toByteData(format: ImageByteFormat.png);

    if (data != null) {
      img = Image.memory(Uint8List.view(data.buffer));
    }

    setState(() {});
  }

  void _onPressedButton() {
    getCanvasImage(controller.text);
  }
}