// pages/sign/sign.js var context = null; var isButtonDown = false; var arrx = []; var arry = []; var arrz = []; var canvasw = 0; var canvash = 0; //注册页面 Page({ canvasIdErrorCallback: function (e) { console.error(e.detail.errMsg) }, //开始 canvasStart: function (event) { isButtonDown = true; arrz.push(0); arrx.push(event.changedTouches[0].x); arry.push(event.changedTouches[0].y); }, data: { src: "", img: "", rpx: '' }, onLoad: function (options) { var that = this // 使用 wx.createContext 获取绘图上下文 context context = wx.createCanvasContext('canvas'); context.beginPath() context.setStrokeStyle('#000000'); context.setLineWidth(4); context.setLineCap('round'); context.setLineJoin('round'); // context.drawImage('../../images/img111.png', 0, 0, canvasw, 500); context.draw(false); }, //过程 canvasMove: function (event) { var that = this if (isButtonDown) { arrz.push(1); //console.log(event) arrx.push(event.changedTouches[0].x); arry.push(event.changedTouches[0].y); }; for (var i = 0; i < arrx.length; i++) { if (arrz[i] == 0) { context.moveTo(arrx[i], arry[i]) } else { context.lineTo(arrx[i], arry[i]) }; }; context.clearRect(0, 0, canvasw, canvash); context.setFillStyle("#FFF") context.fillRect(0,0,900,900) context.setStrokeStyle('#000000'); context.setLineWidth(4); context.setLineCap('round'); context.setLineJoin('round'); context.stroke(); context.draw(false); }, // 点击保存图片 clickMe: function () { wx.showToast({ title: '签名生成中...', icon: 'loading', duration: 2000 }); setTimeout(function () { context.draw(true, wx.canvasToTempFilePath({ canvasId: 'canvas', fileType: 'png', //quality:0.5, success: function (res) { //console.log(res); let pages = getCurrentPages(); let prevPage = pages[pages.length - 2]; //首页 //console.log(pages); //console.log(prevPage); var signs = [res.tempFilePath]; // 限制最多只能留下5张照片 prevPage.setData({ signs }); wx.navigateBack(); // //存入服务器 // wx.uploadFile({ // url: 'a.php', //接口地址 // filePath: res.tempFilePath, // name: 'file', // formData: { //HTTP 请求中其他额外的 form data // 'user': 'test' // }, // success: function (res) { // console.log(res); // }, // fail: function (res) { // console.log(res); // }, // complete: function (res) { // } // }); // wx.saveImageToPhotosAlbum({ // filePath: res.tempFilePath, // success(res) { // console.log(res) // wx.hideLoading(); // wx.showToast({ // title: '保存成功', // }); // }, // fail() { // wx.hideLoading() // } // }); } })); }, 2000); }, canvasEnd: function (event) { isButtonDown = false; }, cleardraw: function () { //清除画布 arrx = []; arry = []; arrz = []; context.draw(false); }, goWorksheet(e) { wx.navigateBack(); }, onShow(e) { if (context) { this.cleardraw(); } } })