hiloteam / Hilo

A Cross-end HTML5 Game development solution
https://hiloteam.github.io/
MIT License
5.93k stars 863 forks source link

关于Hilo.drag的问题 #92

Closed xiangfengsu closed 7 years ago

xiangfengsu commented 7 years ago

写了一个探照灯效果,可是有些问题,望指教! 在快速移动dragView 的时候,graphics无法严丝合缝 image 测试demo

var stageWidth = innerWidth; var stageHeight = innerHeight; var stage = new Hilo.Stage({ container:document.body, width:stageWidth, height:stageHeight, renderType:'canvas' }); stage.enableDOMEvent([Hilo.event.POINTER_START, Hilo.event.POINTER_MOVE, Hilo.event.POINTER_END]); var ticker = new Hilo.Ticker(60); ticker.addTick(stage); ticker.start(); var img = 'http://bxu2713410132.my3w.com/bg.jpg'; var bg = new Hilo.Bitmap({ x: 0, y: 0, image: img, width: stageWidth, height: stageHeight, }); var maskBg = new Hilo.View({ x: 0, y: 0, width: stageWidth, height: stageHeight, background: '#000', alpha: .75, }); var graphics = new Hilo.Graphics({ x: 10+25, y: 10+25, }); graphics.beginFill("#000").drawCircle(0, 0, 100 >> 1).endFill(); var bg1 = new Hilo.Bitmap({ x: 0, y: 0, width: stageWidth, height: stageHeight, image: img, mask: graphics }); var dragView = new Hilo.Bitmap({ x:10, y:10, width:150, height:150, image:'http://bxu2713410132.my3w.com/drag.png' }); Hilo.util.copy(dragView, Hilo.drag); dragView.startDrag([0, 0, stageWidth, stageHeight]); dragView.on("dragStart", function(e) {

graphics.x = e.target.x + 25;
graphics.y = e.target.y + 25;

}); dragView.on("dragMove", function(e) { graphics.x = e.target.x + 25; graphics.y = e.target.y + 25; }); dragView.on("dragEnd", function(e) { graphics.x = e.target.x + 25; graphics.y = e.target.y + 25; }); setTimeout(function(){ dragView.stopDrag(); },5000); stage.addChild(bg,maskBg,bg1,dragView);

06wj commented 7 years ago

这个是因为先发了dragMove事件后再改变位置导致的,已修复。