When navigating through UMG buttons using Arrow keys, Hovered image won’t appear, but when moving mouse cursor over buttons Hovered image appears appropriately.
Is this a bug or is their any other way to achieve Hovered image when button Has Keyboard Focus?
Relevant to my interests. Working on this now, and noticed the same thing. When a button has keyboard focus, it gets that dotted white outline around it, and if it is pressed via a controller/keyboard the pressed color works. However, if a button has keyboard focus it does not have the hovered color. I tried briefly to play around with it in blueprints.
I tried setting the hovered color of a button in my array of buttons within blueprint. I can confirm given the options of ‘make buttonstyle’ node if I set the color on Normal or Pressed the color comes through on the button, however, Hovered still remains neutral. If I move my mouse over the button, the hover color is there.
So how can we get a keyboard focused button to have the same effect as if the mouse was focused on it? Seems like this may be a bug.
Also, while were on topic, how can I change the dotted white outline of the button when a button has keyboard focus?
I’ll keep playing around with it, but it may be a bug.
I think this may be what you’re looking for. I had a problem with this myself. You should think of the mouse as the “default” controller for unreal engine and the umg, and keyboard is secondary. So what you want to do is, use an OR boolean that you can find by right clicking and just typing in “or”. I know this is an old question, but this may be useful to someone new who stumbles upon this question.
This is how I did mine. I know it’s kind of messy, but I like to have all my nodes close together once I’m finished with them, instead of all scattered about. I made custom events like “Highlight…” and attached to them to Event Tick because else it won’t work. I’m bad at explaining Unreal things, but basically, “Has keyboard focus” is for the keyboard, and is Hovered is for the Mouse. When either of these (OR boolean) are occuring, then set the color to red. If the button is not being hovered over, or does not have keyboard focus, then set the color to white. Do you understand? If you have any trouble understanding then just comment back. I’ll try my best to explain some more. >.<"
Wanted to post this in case anybody else out there was looking for a solution that doesn’t have to update every tick, and that can be pasted into many widgets and reused!
The widget BP’s event construct node is off to the left. All of this spaghetti should come out of that node.
For each unique widget, you will have to change the array to include all buttons in that widget that are focusable. (There’s no doubt a better way of doing this than plugging each individual button into the array, haha.)
Kind of an old topic, but here’s a way to fix this. Keep in mind this is for buttons that have an image component. I found a to work around this quirk by converting the images I used for the buttons into sprites, putting the buttons themselves into an array, and the sprites into an array accordingly (Seperate array for unhovered and hovered sprites.) Then a branch with “has keyboard focus” condition. If false it converts the normal button sprites into brushes from the array and sets the style. If true, it sets the index variable (promote to var) and sets that buttons style through sprite >> brush. Hope this helps anybosy trying to search how to do this.
Edit: If you do this, the hovered image component will be replaced on mousehover, so hovering with mouse wont change the sprite. To fix this is easy: add a button “On hovered” event to each button, get a ref to that button and plug both the event and the button ref into a “set Keyboard Focus” node. Happy blueprinting!
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
