EffectCameraStream.paintTo
收藏我的收藏
收藏语法
EffectCameraStream.paintTo(options)
参数说明
options 为 object 类型，属性如下：属性名 | 类型 | 默认值 | 必填 | 说明 | 最低支持版本 |
canvas | Canvas 对象 | | 是 | 绘制到的目标画布对象 | 2.19.0 |
dx | number | 0 | 否 | 绘制到 canvas 的 x 轴位置 | 2.19.0 |
dy | number | 0 | 否 | 绘制到 canvas 的 y 轴位置 | 2.19.0 |
sx | number | 0 | 否 | 要绘制 Video 对象的起始 x 轴位置位置，即截取视频的起始位置坐标 | 2.19.0 |
sy | number | 0 | 否 | 要绘制 Video 对象的起始 y 轴位置位置，即截取视频的起始位置坐标 | 2.19.0 |
success | function | | 否 | 接口调用成功的回调函数 | 2.19.0 |
fail | function | | 否 | 接口调用失败的回调函数（包含调用失败，以及取消操作） | 2.19.0 |
complete | function | | 否 | 接口调用结束的回调函数（调用成功、失败都会执行），回调参数同成功或失败回调 | 2.19.0 |
回调成功
回调参数为 object 类型，属性如下：
属性 | 类型 | 说明 | 最低支持版本 |
errMsg | string | "paintTo:ok" | 2.19.0 |
回调失败
回调参数为 object 类型，属性如下：
属性 | 类型 | 说明 | 最低支持版本 |
errMsg | string | "paintTo:fail"+ 错误详情 | 2.19.0 |
errNo | number | 错误码 | 2.19.0 |
错误码
取值 | 说明 |
21501 | 未申请相机资源，请于 EffectCameraStream.request 成功后调用 |
代码示例
预期表现：点击【打开相机】，相机数据将绘制到 canvas 区域。
<canvas type="webgl" id="myCanvas"></canvas> <button type="primary" bindtap="requestEffectCamera">打开相机</button>
Page({ onShow: function () { this.effectCameraStream = tt.createEffectCameraStream(this); this.effectCameraStream.onError(this.onError); this.effectCameraStream.onRequest(this.onRequest); this.effectCameraStream.onPlay(this.onPlay); }, requestEffectCamera() { tt.createSelectorQuery() .select("#myCanvas") .node() .exec((res) => { this.canvas = res[0].node; this.canvasCtx = this.canvas.getContext("webgl"); this.effectCameraStream.request({ orientation: "back", }); }); }, onError(error) { console.log("onError", error); const { type, errMsg } = error; tt.showModal({ title: `onError ${type}`, content: errMsg, }); }, onRequest() { console.log("相机资源申请成功"); this.effectCameraStream.play(); }, onPlay(cameraVideo) { console.log("相机数据", cameraVideo); tt.showToast({ title: "相机打开", }); this.paint(); }, paint() { this.effectCameraStream.paintTo({ canvas: this.canvasCtx.canvas, dx: 0, dy: 0, sx: 0, sy: 0, success: () => { // 绘制成功 }, fail: (err) => { tt.showModal({ title: "绘制失败", content: err.errMsg, }); }, }); this.requestId = this.canvas.requestAnimationFrame(() => { this.paint(); }); }, });
Bug & Tip
- •Tip：当前为将数据源等比例绘制到 canvas，不支持指定数据源比例。
