+
80
-

如何在微信小程序中使用snapshot生成自定义海报?

如何在微信小程序中使用snapshot生成自定义海报?


网友回复

+
0
-

snapshot是截图组件。 支持将其子节点的渲染结果导出成图片,该组件需配合 snapshot 接口使用。 目前仅在 Skyline 渲染引擎 下支持。

基础库 3.0.1 开始支持,低版本需做兼容处理。

如需离屏渲染导出,可将 snapshot 组件移动到屏幕外或设置 transform: scale(0) 即可,但不能设置为 display: none 或 visibility: hidden。

子节点不能包含原生组件,其他任意组件均可使用

支持对任意大小的区域导出图片,即导出图片没有尺寸限制

示例代码

wxml

<snapshot id="target">
<view>content</view>
</snapshot>

js
Page({
  onReady() {
    this.createSelectorQuery()
      .select("#target")
      .node()
      .exec(res => {
        const node = res[0].node
        node.takeSnapshot({
          type: 'arraybuffer',
          format: 'png',
          success: (res) => {},
          fail(res) {}
        })
  }
})
示例代码片段

我知道答案,我要回答