ios橡皮擦效果不行
发布于 6 年前 作者 xiuyingxue 19125 次浏览 来自 问答

ios橡皮擦效果不行,安卓和模拟器正常

// pages/test.js

Page({

/**

  * 页面的初始数据

  */

data: {

windowWidth: 0,

windowHeight: 0,

s: 0,

x1: 0,

y1: 0,

xx1: 100,

yy1: 50,

a: 20,

jiange: 20,

timeout: 0,

totimes: 100,

ctx: null,

cpw: 0,

cph: 0,

dd:0

},

/**

  * 生命周期函数–监听页面加载

  */

onLoad: function (options) {

const self = this;

wx.getSystemInfo({

success: function (res) {

console.log(res);

let s = res.windowWidth / 750;

let cpw = 0;//148 * s / 2;

let cph = 156 * s * .8;

let x1 = 560 * s;

let y1 = 240 * s;

self.setData({

windowWidth: res.windowWidth,

windowHeight: res.windowHeight,

s: s,

cpw: cpw,

cph: cph,

x1: x1,

y1: y1,

xx1: x1,

yy1: y1

});

}

})

},

/**

  * 生命周期函数–监听页面初次渲染完成

  */

onReady: function () {

this.ctx = wx.createCanvasContext(“mycanvas”, this);

let s = this.data.s;

this.ctx.drawImage(“index/images/qz.png”, 60 * s, 274 * s, 672 * s, 504 * s);

this.ctx.draw();

},

//事件处理函数

bindtouchstart: function (e) {

if (this.ctx == null) return;

clearTimeout(this.data.timeout);

let xx1 = e.touches[0].x - this.data.cpw;

let yy1 = e.touches[0].y - this.data.cph;

this.setData({

x1: e.touches[0].x,

y1: e.touches[0].y,

xx1: xx1,

yy1: yy1

});

this.ctx.save();

this.ctx.beginPath();

this.ctx.arc(this.data.x1, this.data.y1, this.data.a, 0, 2 * Math.PI);

this.ctx.clip()

this.ctx.clearRect(0, 0, this.data.windowWidth, this.data.windowHeight);

this.ctx.restore();

this.ctx.draw(true);

},

bindtouchmove: function (e) {

if (this.ctx == null) return;

let x2 = e.touches[0].x;

let y2 = e.touches[0].y;

let asin = this.data.a * Math.sin(Math.atan((y2 - this.data.y1) / (x2 - this.data.x1)));

let acos = this.data.a * Math.cos(Math.atan((y2 - this.data.y1) / (x2 - this.data.x1)));

let x3 = this.data.x1 + asin;

let y3 = this.data.y1 - acos;

let x4 = this.data.x1 - asin;

let y4 = this.data.y1 + acos;

let x5 = x2 + asin;

let y5 = y2 - acos;

let x6 = x2 - asin;

let y6 = y2 + acos;

this.ctx.save();

this.ctx.beginPath()

this.ctx.arc(x2, y2, this.data.jiange, 0, 2 * Math.PI);

this.ctx.clip()

this.ctx.clearRect(0, 0, this.data.windowWidth, this.data.windowHeight);

this.ctx.restore();

this.ctx.draw(true);

this.ctx.save()

this.ctx.beginPath()

this.ctx.moveTo(x3, y3);

this.ctx.lineTo(x5, y5);

this.ctx.lineTo(x6, y6);

this.ctx.lineTo(x4, y4);

this.ctx.closePath();

this.ctx.clip()

this.ctx.clearRect(0, 0, this.data.windowWidth, this.data.windowHeight);

this.ctx.restore();

this.ctx.draw(true);

let xx1 = x2 - this.data.cpw;

let yy1 = y2 - this.data.cph;

this.setData({

x1: x2,

y1: y2,

xx1: xx1,

yy1: yy1,

dd: this.data.dd + 1

});

},

bindtouchend: function (e) {

if (this.ctx == null) return;

const self = this;

let timeout = setTimeout(function () {

/* if (self.data.dd > 79) {

       wx.reLaunch({

         url: ‘info/user’,

       })

     }

*/

}, this.data.totimes);

this.setData({

timeout: timeout,

});

},

/**

  * 生命周期函数–监听页面显示

  */

onShow: function () {

},

/**

  * 生命周期函数–监听页面隐藏

  */

onHide: function () {

},

/**

  * 生命周期函数–监听页面卸载

  */

onUnload: function () {

},

/**

  * 页面相关事件处理函数–监听用户下拉动作

  */

onPullDownRefresh: function () {

wx.stopPullDownRefresh();

},

/**

  * 页面上拉触底事件的处理函数

  */

onReachBottom: function () {

},

/**

  * 用户点击右上角分享

  */

onShareAppMessage: function () {

}

})

2 回复

好的,谢谢。这个问题应该帧率过低

没明白问题是什么,另外,如果怀疑是接口有bug,请提供相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),我们定位下问题

回到顶部