微信小程序> 签到小程序可以看谁没签到-微信小程序canvas的撤销功能-签到小程序

签到小程序可以看谁没签到-微信小程序canvas的撤销功能-签到小程序

浏览量:3437 时间: 来源:L_junpeng

1.小程序越来越简单,提供给开发者的api也越来越多,微信这个平台真的很厉害~~

2.-------------------

3.canvas画板在涂鸦的时候,一不小心画错了一步,想撤销上一步,还是在微信小程序中去实现这个功能,顿时卡住了,还是去翻百度,翻csdn、简书,总结了几个文档按照自己的思路想了一个简单的方案;

4.在微信小程序的api支持下是这么做的:一个动作start-move-end(cancel)就结束了,小程序有个api

saveCurrentDrawWorks:function(){wx.canvasToTempFilePath({x:0,y:0,width:0,height:0,destWidth:0,destHeight:0,canvasId:self.data.Id,success:function(res){varimgPath=res.tempFilePath;varallDrawWorksPath=self.data.allDrawWorksPath;allDrawWorksPath.push(imgPath);self.setData({allDrawWorksPath:allDrawWorksPath,})},fail:res={console.log('获取画布图片失败',res);}})},

5.在每次start的时候调用保存图片的这个方法,将当前画布的图片保存在本地的数组中;

6.点击撤销的时候:

drawRevoke:function(){varallDrawWorksPath=self.data.allDrawWorksPath;if(allDrawWorksPath==null||allDrawWorksPath.length==0||allDrawWorksPath==undefined){return;}varprivWorksPath=allDrawWorksPath.pop();self.setData({allDrawWorksPath:allDrawWorksPath,})drawPath.pop();self.setPaintSize(self.data.LineWidth);self.setPaintColor(self.data.StrokeStyle);drawContext.drawImage(privWorksPath,0,0,screenWidth,screenHeight);drawContext.draw();if(allDrawWorksPath.length==0){}},

7.删除保存数组中的最后一个图片地址,并重画这个地址的图片(drawImage);

8.大功告成~虽然简单,但确实想了很久,,如果有帮到你,我会很开心

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎