Beginner Question About Button Layering

[Stankyfist]

Hi,
I have a simple test scene (image attached) -- some parent nodes and two touch screen buttons.
I have one large touchscreen button (the highlighted green block taking up almost entire viewport - just as a test) and a smaller touch screen button on top (in red with the icon svg image).

touchButtonIssue.jpg (42.63 KiB) Viewed 6190 times

What I want to happen is when you click the smaller (red) button (layered on top) I do not want the click to pass thru to the larger (green) button (layered underneath) but you can see in the output both buttons fire off anytime I only click on the smaller button.

I already tried setting the "Mouse > Filter > Stop" to prevent propagation on both buttons but nothing is working.

Just to give you more background on this simple scene - I am connecting both touchscreen buttons using "pressed" signals (top right side Node tab - next to the inspector tab) to methods that target the main control node (at the very top of the scene tree).

I swear I tried looking this up online and in the help docs but I found nothing.
any help would be greatly appreciated.
kind regards,
SF

[Stankyfist]

I figured it out myself but I find this to be a bit "hacky"
So for anyone else who may run into this issue I will explain what I did.

For two touch screen buttons stacking on top of each other - the larger touch screen button which I had at the bottom (in terms of order) I did a "released()" signal and setup a bool switch variable to check if the other button was also getting the clicked or not. Depending on that switch being true or not I was able to "cancel" out any unwanted behavior.

Here is some sample code on what I am trying to explain:

Code: Select all

# switch variable
var topClicked:bool = false
 

# large bottom on bottom pressed
func _on_touch_screen_bottom_pressed():
	if(!topClicked):
		print("bottom pressed")


# smaller button on top pressed
func _on_touch_screen_top_pressed():
	topClicked = true
	print("top pressed")


# added release for top to reset topClick
func _on_touch_screen_top_released():
	topClick = false

I do not like this approach because if I had a lot of touch screen buttons this would start to get out of control.
I just wish the layer index and mouse filter would actually work...
hope that helps someone else.
cheers

[megalomaniak]

Yeah, I guess it is hacky, but I'm glad you found some way to make it work. TBH layering buttons like this, especially when they are on the same canvas layer just seems very strange to me in the first place. I don't think most would do something like this in the first place and the core engine developers never considered such a case.