自定义组件中使用createContext,()drawCanvas()不行
发布于 5 年前 作者 guojing 12232 次浏览 来自 问答

你想反馈一个 Bug 还是 提一个需求?

bug

如果是 Bug:

* Bug 表现是什么?预期表现是什么?

表现就是在自定义组件中使用canvas创建一个手绘功能,但是使用

wx.createContext() 配合 wx.drawCanvas() 可是没有效果,在Page中使用没问题,我知道

wx.createCanvasContext(‘canvas’, this) 这样是可以的,但是我是座手绘功能,这个用接口性能很差。

* 如何复现?

.wxml

<canvas id=“canvas” canvas-id=‘canvas’ class=‘draw’ style=“background: #fff;”

disable-scroll=‘true’

bindtouchstart=‘touchStart’

bindtouchmove=‘touchMove’

bindtouchend=‘touchEnd’

touchcancel=“canvasEnd”

binderror=“canvasIdErrorCallback”>

</canvas>

.js

touchStart: function (event) {

context = wx.createContext()

context.beginPath()

context.setStrokeStyle(this.data.pen.color)

context.setLineWidth(this.data.pen.lineWidth)

context.setLineCap(‘round’)

context.setLineJoin(‘round’)

startX = event.changedTouches[0].x

startY = event.changedTouches[0].y

},

touchMove: function (event) {

// 方案2

var startX1 = event.changedTouches[0].x

var startY1 = event.changedTouches[0].y

context.moveTo(startX, startY)

context.lineTo(startX1, startY1)

context.stroke()

startX = startX1

startY = startY1

wx.drawCanvas({

canvasId: ‘canvas’,

reserve: true,

actions: context.getActions() // 获取绘图动作数组

})

},

* 提供一个最简复现 Demo

如果是需求:

* 你希望有什么能力?

* 你需要这个能力的场景是 ?

1 回复

可是用createCanvasContext做手绘,性能极差,也可能是我方法不对吧,createCanvas drawCanvas 即将废弃,会不会保留只是不更新,还是说直接去掉?

回到顶部