Flutter 轻松合成/覆盖资产目录中的 PNG 图像

【问题标题】：Flutter easily composite / overlay PNG images from the assets directoryFlutter 轻松合成/覆盖资产目录中的 PNG 图像
【发布时间】：2021-10-18 09:00:02
【问题描述】：

寻找一个简单快速的示例/教程来在 Flutter 中合成/叠加多个图像，使用资产目录中的 (PNG) 图像：

我研究过的几个选项：

操作 Uint8List 并在 image.Memory 中使用它
在我自己的 Painter 中使用 canvas.drawAtlas
使用image library（在这种情况下似乎有点矫枉过正

找不到任何适合我需要的工作示例... 我会很感激任何对我有帮助的工作示例/教程，谢谢！

【问题讨论】：

标签： image flutter

【解决方案1】：

4.使用 Stack 和 RepaintBoundary 组合生成新图像：

Future<Uint8List> _takeScreenShot(context) async {
    RenderRepaintBoundary boundary = _repaintKey.currentContext.findRenderObject();
    ui.Image image = await boundary.toImage(pixelRatio: 2.0);
    ByteData byteData = await image.toByteData(format: ui.ImageByteFormat.png);
    Uint8List pngBytes = byteData.buffer.asUint8List();
    return pngBytes;
}

Stack(
  key: _repaintKey,
  children: [
    //your background image,
    //your png image,
  ],
)

【讨论】：