2.1 KiB
FocusableButton
This widget fills some gaps in functionality of the standard Button, including better highlight rendering when the button has the keyboard / gamepad focus, and events you can listen in to when focus changes.
FocusableButtons are particularly useful in Menus, but can be used anywhere.
Important: Disabling default focus rendering
Unreal makes a token effort at providing a way to render which of your controls has the keyboard / gamepad focus, but it's rubbish. It's a grey dotted line that looks awful. No-one wants that.
The FocusableButton widget in this library provides a much nicer default focus option (using the Hovered style), and also provides you focus events you can use to do something more advanced if you want. So we have no need for Unreal's dotted line nonsense.
- Open Project Settings
- Find the Focus section
- Change Render Focus Rule to Never
All better. 😉
Better Focus Highlighting
FocusableButton can highlight the button in the same way as the "Hover" style, thereby unifying how your button looks whether the player mouses over it, or selects it with keyboard / gamepad.
All you need to do to benefit from this is:
- Enable "Use Hover Style When Focussed" in the inspector
- Define the Hovered style under Appearance
Changing focus on Hover
There's also a "Take Focus On Hover" option in the inspector (default true). This ensures that if one widget has the focus currently, from keyboard or gamepad navigation, and you hover over another widget with the mouse, that other widget will lose focus in favour of the hovered widget.
The main benefit of this is that otherwise you can have 2 widgets highlighted, one via the old focus and one where the mouse is hovering, which is confusing!
Focus Events
FocusableButton also has 2 new events exposed, "On Focus Received" and "On Focus Lost". You can use this to track which button currently has the focus, which can be useful if for example you want to use something else to indicate the current focus, like an icon or indicator that isn't part of the button itself.