Re: Prevent onClick for objects behind Sprite (z-index)

[aaron.g...@gmail.com]

Looking at the pointer event code inside the engine, try returning true instead of false. Similar to our collision system, it means you're confirming that something happened with this event. Returning false is handy if you want the click event to register against multiple objects.

I realize it's a bit reverse from typical browser patterns, but it also matches how one uses callbacks in game systems typically. I don't recall when this was added if there was another reason for that choice.

On Tuesday, August 23, 2016 at 6:54:11 AM UTC-4, Danny Z wrote:
> Hello,
>
>
> I apologize for the question, I'm sure it was already answered, but all similar issues are years old and links are dead, so thought I'd ask here.
>
>
>
>
> So, I've just started learning Melon a bit and I ran into an issue I can't resolve.
> Namely, if I place a layer (Sprite) over the screen, if I click on a place that has something behind it, that event is triggered.
>
>
> Now, the problem might be that I'm using the buttons wrong, but there just could be a way to prevent this from happening. Apparenty adding false
>
>
>
>
>
>
>
>
> Here is what I have:
>
>
>
>
>
>
> start_game = me.GUI_Object.extend({
>  init : function (a, b) {
>
>
>
>  var c = {};
>
>
>  c.image = "button",
>
>
>  c.framewidth = 152,
>
>
>  c.frameheight = 75,
>
>
>  this._super(me.GUI_Object, "init", [a, b, c])
>
>
>  },
>  onClick : function (a) {
>
>
>
>  return me.state.change(me.state.PLAY), false
>
>
>  }
>  })
>
>
>
>
>
>
>
>
> call_menu = me.GUI_Object.extend({
>  init : function (a, b) {
>
>
>
>  var c = {};
>
>
>  c.image = "button",
>
>
>  c.framewidth = 152,
>
>
>  c.frameheight = 75,
>
>
>  this._super(me.GUI_Object, "init", [a, b, c])
>
>
>  },
>  onClick : function (a) {
>
>
>
>  var b = me.loader.getImage("layer_bg");
>
>
>  me.game.world.addChild(new me.Sprite(me.video.renderer.getWidth() / 2 - b.width / 2, me.video.renderer.getHeight() / 2 - b.height / 2, {
>
>
>  image : b
>  
>
>
>  }), 12);
>
>
>  return  false
>
>
>  }
>  })
>
>
>
>
>
>
>
>
>
>
>
>
> If I click on the area where "start:game" is (behind the sprite), it counts as being clicked on. Any way to prevent this?

[Danny Z]

I tried using true, but same result.

Well, worst case scenario, I'll save the buttons in a global variable, then remove/create it as needed.

[Jason Oster]

There's a known issue with click-through layer ordering when floating and non-floating clickable regions are used together.

So the first thing I would check is verifying all clickable regions are floating. The second thing to look for is that the first event handled is actually the region with the higher priority (higher z-index) and that this event is returning true to prevent further propagation to lower priority regions.

On Aug 23, 2016, at 11:27, Danny Z <dario.zv...@idbgroup.net> wrote:

I tried using true, but same result.

Well, worst case scenario, I'll save the buttons in a global variable, then remove/create it as needed.

--
You received this message because you are subscribed to the Google Groups "melonJS - A lightweight HTML5 game engine" group.
To unsubscribe from this group and stop receiving emails from it, send an email to melonjs+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Danny Z]

So, that means I'd have to make the child "start_game" floatable? Would that be "c.floatable = true" in my example?

As for z-index, the layer was put on a higher number, but still same issue. I haven't tried a greatly bigger number though.


Will these to see if it helps.