excaliburjs / Excalibur

🎮 Your friendly TypeScript 2D game engine for the web 🗡️
https://excaliburjs.com
BSD 2-Clause "Simplified" License
1.74k stars 188 forks source link

bug: enter/leave pointer events cannot be cancelled on overlapping actors #3059

Open eonarheim opened 3 months ago

eonarheim commented 3 months ago

Discussed in https://github.com/excaliburjs/Excalibur/discussions/3058

Originally posted by **spustlik** May 12, 2024 Hi, than you for you effort in exceliburjs, it is fantastic framework. I am at the beginning and trying to use actor pointer events, but in my scene there are overlapping actors (using z-index). But with no luck - in some configuration events are fired on all actors (if pointerenter or pointerleave), or pointerleave is not called when moving from back actor to front actor.CAncelling event doesn't help. This is my code: ``` class TestScene extends ex.Scene { onInitialize(game: ex.Engine) { super.onInitialize(game); let a = this.addActor(ex.vec(100, 100)); a.z = 10; let b = this.addActor(ex.vec(130, 130)); b.z = 20; } private addActor(pos: ex.Vector) { let a = new ex.Actor({ width: 200, height: 100, pos: pos, anchor: ex.vec(0, 0), opacity: 0.8 }); let r = new ex.Rectangle({ width: a.width, height: a.height, strokeColor: ex.Color.Green, lineWidth: 5, color: ex.Color.Red }); a.graphics.use(r); this.add(a); a.pointer.useGraphicsBounds = true; a.events.on('pointermove', (ev) => { r.color = ex.Color.Black; ev.cancel(); }); a.events.on('pointerleave', (ev) => { r.color = ex.Color.Red; }); a.events.on('pointerdown', (ev) => { console.log('pointer down on ' + a.id); ev.cancel(); }); return a; } } what i am doing wrong? Or how to achieve clicking and moving on actors, but only on topmost? Thank you for any advice, Jan
github-actions[bot] commented 1 month ago

This issue hasn't had any recent activity lately and is being marked as stale automatically.