收藏
回答

canvas对象事件不能多次触发是什么原因

问题模块
API和组件

以bindtouchstart为例,点击firstCanvas触发touch事件,在secondCanvas绘制变量i,pc端模拟器一直正常工作,到了手机预览测试时,多次快速点击或者拖动图像后就会卡住不再触发事件,必须清空缓存重新打开才能工作,一部安卓4.2一部安卓5.0都频繁出现这个问题,难道是系统问题

<!-- canvas.wxml -->
<view class="section">
<canvas style="width: 300px; height: 200px;background-color:grey" canvas-id="firstCanvas" bindtouchstart="touch"></canvas>
</view>
<!-- 当使用绝对定位时,文档流后边的 canvas 的显示层级高于前边的 canvas -->
<view>
<canvas style="width: 300px; height:200px ; background-color:blue;" canvas-id="secondCanvas"></canvas>
</view>
var i=0;
Page({
  canvasIdErrorCallback: function (e) {
    console.error(e.detail.errMsg)
  },
  touch: function()
  {
 
    var context2 = wx.createCanvasContext('secondCanvas')
    context2.setFontSize(20)
    context2.fillText(++i, i+ 15, i + 30)
    context2.draw()
  }
  ,
  onReady: function (e) {
    // 使用 wx.createContext 获取绘图上下文 context
    var context = wx.createCanvasContext('firstCanvas')
 
    context.setStrokeStyle("#00ff00")
    context.setLineWidth(5)
    context.rect(0, 0, 200, 200)
    context.stroke()
    context.setStrokeStyle("#ff0000")
    context.setLineWidth(2)
    context.moveTo(160, 100)
    context.arc(100, 100, 60, 0, 2 * Math.PI, true)
    context.moveTo(140, 100)
    context.arc(100, 100, 40, 0, Math.PI, false)
    context.moveTo(85, 80)
    context.arc(80, 80, 5, 0, 2 * Math.PI, true)
    context.moveTo(125, 80)
    context.arc(120, 80, 5, 0, 2 * Math.PI, true)
    context.stroke()
    context.draw()
  }
})


最后一次编辑于  2017-06-25  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

2 个回答

  • 瑞
    2017-06-26

    66666

    2017-06-26
    赞同
    回复
  • eee
    eee
    2017-08-15

    大概解决了。。6.0正常工作,好像是系统问题,难道小程序安卓6.0往下不兼容?

    2017-08-15
    赞同
    回复