OffscreenCanvas.getContext

收藏

我的收藏

基础库 1.78.0 开始支持本方法，这是一个同步方法。

获取 OffscreenCanvas 的绘图上下文。

语法

OffscreenCanvas.getContext(type)

参数说明

type

类型	默认值	必填	说明	最低支持版本
string		是	canvas 类型，可取值 2d 或 webgl	1.78.0

返回值

RenderingContext

扫码体验

代码示例

开发者工具中预览

<!-- index.html -->
<button type="primary" size="default" bindtap="createOffscreenCanvas">
  createOffscreenCanvas
</button>
<canvas id="myCanvas" type="2d"></canvas>

let canvas, canvasCtx, animateId, offcanvas, offctx;
Page({
  onReady() {
    tt.createSelectorQuery()
      .select("#myCanvas")
      .node()
      .exec((res) => {
        canvas = res[0].node;
        canvasCtx = canvas.getContext("2d");
      });
  },
  createOffscreenCanvas() {
    offcanvas = tt.createOffscreenCanvas();
    offctx = offcanvas.getContext("2d");

    offcanvas.width = 100;
    offcanvas.height = 100;
    offctx.rect(0, 0, 100, 100);
    offctx.fillStyle = "red";
    offctx.fill();

    canvasCtx.drawImage(offcanvas, 0, 0);
  },
});

Bug & Tip

• Tip：本 API 仅适用于<canvas> 组件 V2。