cocos creator引擎版本是2.2.0
mask组件的_graphics存在重大BUG,在原生平台(或是cocos 模拟器中运行)擦除的图案又会重新出现,在web平台不会;
附上DemoDemo.zip (1.3 MB)
兄弟,逻辑上的问题哦,并不是graphics的bug
我把你的代码改了一下就OK了
const { ccclass, property } = cc._decorator;
@ccclass
export default class Helloworld extends cc.Component {
@property(cc.Mask)
mask: cc.Mask = null;
@property(cc.Graphics)
pen: cc.Graphics = null;
@property
cr: number = 0;
private paths: cc.Vec2[][] = [];
private _points: cc.Vec2[] = [];
onLoad() {
//注册触摸监听事件
this.node.on(cc.Node.EventType.TOUCH_START, this.onTouchStart, this);
this.node.on(cc.Node.EventType.TOUCH_MOVE, this.onTouchMove, this);
this.node.on(cc.Node.EventType.TOUCH_END, this.onTouchEnd, this);
}
start() {
console.log(this.mask);
this.mask._graphics.lineWidth = 30;
this.mask._graphics.strokeColor = cc.color(255, 0, 0, 150);
this.mask._graphics.fillColor = cc.color(0, 255, 0, 255); //cc.color(0, 255, 0);
this.mask._graphics.lineJoin = cc.Graphics.LineJoin.ROUND;
this.mask._graphics.lineCap = cc.Graphics.LineCap.ROUND;
}
//开始点击
onTouchStart(event: cc.Event.EventTouch) {
let point = event.touch.getLocation();
point = this.node.convertToNodeSpaceAR(point);
var points: cc.Vec2[] = [];
this._points = points;
this._points.push(point);
this.paths.push(this._points);
}
//点击移动
onTouchMove(event: cc.Event.EventTouch) {
let point = event.touch.getLocation();
point = this.node.convertToNodeSpaceAR(point);
this._points.push(point);
for (let i = 0; i < this.paths.length; i++) {
const points = this.paths[i];
this.mask._graphics.moveTo(points[0].x, points[0].y);
for (let j = 1; j < points.length; j++) {
const element = points[j];
this.mask._graphics.lineTo(element.x, element.y);
}
}
this.mask._graphics.stroke();
}
//点击结束
onTouchEnd(event: cc.Event.EventTouch) {
}
}
2赞
非常感谢,