Multiple buttons on screen causes some to become non-interactable

Hi. I have created two different widgets each only consisting of a button inside a canvas panel.
I have bound the OnClicked function for both buttons which results in a print string node being called.
There seems to be some problem with the input priority. Both widgets aren’t close to each other on the screen. I noticed that when I give a higher ZOrder value to the AddToViewport function for one of the widgets, the button stays active throughout the duration of the game but the other button becomes non-interactable. It is likewise if I do it the other way.

What can I do to make sure that both buttons remain interactable?

Please provide screenshots of the Widget Designer and Game Viewport

This is the first widget (Sprint Widget)


This is its event graph -

This is the second widget (Teleport Widget)


This is its event graph -

And this is what these 2 widgets look like in the game -

1 Like

What is the Canvas Panel’s Visibility set to on both widgets?
Is it set to “Visible”? If so try changing it to Non-Hit Testable Self Only.

It is already set to Not Hit-Testable(Self Only)

Ok, If that’s the case, something’s weird.
Is it necessary that you need to have two different widgets for each buttons? Why not put both buttons in the same widget?

I am able to interact with the teleport widget no matter what. But not able to interact with the Sprint one

Even if it’s set to a higher Z-Order in the AddToViewport node?

Then I am able to interact with it. But just keeping both at the same value allows me to only interact with the teleport widget

I wasn’t sure about how to set visibility for each specific component in the widget so I didn’t try keeping both buttons in the same widget. What I usually do is, I create a class based on PlayerController and do the widget adding and visibility setting functionality in that.

Ok, Let me try and reproduce the issue.

1 Like

I was able to reproduce the issue.
If the Visibility of the widget itself is set to “Visible” instead of “Non Hit-Testable (Self Only)” It’ll block the widget behind it. When both widgets were set to “Non Hit-Testable (Self Only)”, I was able to Interact with both.

Are you setting the visibility of the widgets anywhere?
Try setting the Visibility of the Widget Blueprints to “Non Hit-Testable (Self Only)” :

  1. Select the widget itself :
    image

  2. Set Visibility to “Non Hit-Testable (Self Only)” :
    image

Basically, I’m setting the visibility of these widgets to visible once they collide with a particular BP actor. So yes, there will be a time where both of these widgets will have a visible state

Just use “Non Hit-Testable (Self Only)” instead of “Visible” when you’re doing that. That should fix it.

But not hit testable will not let me interact with the button right?

Button has it’s on visibility, which should be Visible. I’m talking about the Widget Blueprint itself.

Got it. Seems to have fixed the issue. Thanks a lot for the immediate help! Really appreciate it

1 Like

That’s great, you’re welcome.

1 Like