Random beginner-question: input only above control-layer

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By pferft

Hi everyone,

there is a clickable collision shape. At a point the game creates a second one “above” (= overlapping the first one). Clicking on the above one then triggers both. The lower one shouldn’t though.
I’d like a “full screen layer” to appear between both collision shapes that makes everything beneath unclickable, leaving only the shape above clickable.

I couldn’t find a way to achieve this (only lots of similar questions on the web, none of which helped). I tried control nodes, mouse-filter settings, unhandled_input, scene-tree rearrangements and whatnot, to no avail.
Is there really no way to tell godot “just ignore any input below this layer”? This would help so much…

using a viewport? maybe a bug
Controls in viewport showing I-beam cursor and usable under blocking control · Issue #38633 · godotengine/godot · GitHub
i made a bug about blocking not working in viewport

rakkarage | 2020-10-27 15:56

Hi rakkarage,

putting nodes as children of a viewport-node apparently makes them disappear.
I tried a viewport container as well with an attempt of making it (and its children) (un)pickable with export var pickable = true, but it appears that this doesn’t work (Invalid set index 'input_pickable' (on base: 'ViewportContainer (ViewportContainer.gd)') with value of type 'bool'.). I assume that “invalid” means that a viewport container node can’t be set pickable and/or unpickable, is that right?

Is there any other node I could use as a “every child is (un)pickable”-base? That would be very convenient.

pferft | 2020-10-29 11:39

I am not sure about that error… but Mouse filter works by default to block input from buttons:

enter image description here

so something else must be going on?
My bug was saying this does not work (get blocked) in view port but it does normally…

rakkarage | 2020-10-29 14:55

Thanks for your answer! I perhaps couldn’t make clear what I’m trying to achieve though…

If in this gif-example there would be a second button right on top of the first button and the panel would be between them (on th z-axis), would there be a way to only have the button on top to be triggered while the one below wouldn’t? (I just tried such a setup but either both buttons do trigger or none, depending on the filter-setting of the panel.)

pferft | 2020-10-29 15:15

enter image description here

works for me like that too

rakkarage | 2020-10-29 20:16

Thanks for those GIFs, they’re great!

Indeed it works with buttons just as you show!
Which almost startled me a little for a second, because now I just can’t tell why it wouldn’t work with my “custom buttons”… I built them from an Node2D → Area2D → CollisionShape2D (some sprites attached, an AnimationPlayer and TextLabels…). They work wonderfully on their own but not like these “normal” buttons under such “panel-circumstances”.

Any idea why that could be? Do panel and CollisionShape2D seem “incompatible” here somehow?

pferft | 2020-10-30 10:16

all those nodes have mouse filters…
i suggest replicating the problem in a small example that you can post

rakkarage | 2020-10-30 13:58

Thanks so much for offering to look into this. I uploaded a test-project here: WeTransfer - Send Large Files & Share Photos Online - Up to 2GB Free
(Please just ignore all that hacky test-code! ; )

I couldn’t really find any mouse-filters in those nodes, so yes, I’m a bit at a loss here…
Thanks again for all your help!

pferft | 2020-10-30 15:54

from an quick initial look it appears to work for me… the button is blocked by the panel in TheOrigin.tscn? are you on 3.2.3?

rakkarage | 2020-10-30 19:35

I’m on 3.2.1 - might that be the issue? (Windows 10, GLES2)
My custom-button doesn’t trigger above the panel in my case. The normal button does…

I just installed 3.2.3, but it’s the same here. Hmmm…

pferft | 2020-10-30 22:45

ya sorry o see em now was testing the normal not ‘custom’

not all have mouse filter only the Controls. like the labels which have mouse filter set to ignore?

there is a checkbox control that includes text and check mark and works? why not use that instead of building your own our of 8 other controls?

rakkarage | 2020-10-31 20:55

The thing is that I originally aimed to try to basically succeed in building a button all on my own, so to speak, which was a bumpy ride with lots of different nodes and hacky code included, but it eventually worked out quite fine for me in terms of flexible animating etc. I only then, going on, stumbled over this seemingly unresolvabe problem of implementing these single buttons into a more complex context. Such a little thing to cause such a headache!

Now I guess you’re right - I should see to use “on board” buttons as a base and then try to pimp them with my own designs… probably the best way to approach such elements.

Thanks for building that camparison example with “real” buttons to show me that things actually do what I want! Your help is much appreciated : )

pferft | 2020-11-02 12:59

Sorry I could not be more help.

the checkbox has lots of themable parts too can change the font and the image etc with godot themes

rakkarage | 2020-11-02 16:18

You helped me a lot! The deep dive into this was quite clarifying - I feel like I proceeded in my attempt to understand Godot better, so again, thanks a lot!

pferft | 2020-11-02 16:31