UI Toolkit Focus Jumping Randomly VERY quickly

[alexogorek]

Hi I’ve attached a video here. NO idea what’s going on here… has anyone else seen this?
The buttons are programmatically created in a VisualElement with no fancy classes, just flex row direction
And as you can see in the beginning of the video, pretty much all other buttons work just fine. No idea what’s going on with this document.

I feeeeel like i encountered this about a year ago and “fixed” it by just rebuilding the entire UIDocument. However I had a theory it had something to do with tab index or picking mode. But figured I’d ask here instead of guessing agian.

The code i’m using to generate them:

var button = new Button();
button.AddToClassList("menuButton");
button.AddToClassList("buttonHoverProperties");

button.ShowText(difficultyLevel.difficultyName);
button.setOnPress(() => difficultyPressed(difficultyLevel));
button.setOnFocus(() => updateDescriptionFor(difficultyLevel));

buttonContainer.Add(button);

....
// helpers:
....

public static void setOnPress(this Button element, System.Action action) {
    element.RegisterCallback<MouseOverEvent>(_ => {
        AudioManager.shared.playSoundOneShot(AudioEvent.buttonHover);
        element.Focus();
    });

    element.RegisterCallback<MouseOutEvent>(_ => {
        element.Blur();
    });

    element.clicked += () => {
       if (element.IsLocked()) {
           AudioManager.shared.playSoundOneShot(AudioEvent.cantDoThat);
       } else {
           AudioManager.shared.playSoundOneShot(AudioEvent.buttonClick);
           action.Invoke();
       }
    };
}

public static void setOnFocus(this Button element, System.Action action) {
    element.RegisterCallback<FocusEvent>(e => action());
}

Unity UI Toolkit Focus Bug

[alexogorek]

Yeah what the hell???

Setting button.tabIndex = -1; when creating the buttons all of a sudden fixes this??? VERRRYYY odd.

UI Toolkit Focus Bug Addressed

[alexogorek]

Which weirdly bothers me that the documentation also mentions this “must be” greater than or equal to 0

Unity - Scripting API: UIElements.Focusable.tabIndex

[uMathieu]

I notified our documentation person about improving the tabIndex api doc, thanks for reporting it!

Setting tabIndex to -1 basically removes the VisualElement from the tab-focus cycling mechanic. giving focus to an element means it will be the element that receive Keyboard input/Navigation events. Are you sure that’s what you need here?

Feels like hooking the “updateDescriptionFor” on both PointerOver and FocusEvents would give you the behavior you want, and you wouldn’t need to listen to mouseLeave events. This way, Buttons can be navigated to using the gamepad/keyboard and moving the mouse around wouldn’t steal keyboard focus.

I would also recommend using PointerEvent instead of the backwards-compatibility MouseEvent

[alexogorek]

Ahh okay – yeah I want to support Gamepads (eg: PS5 and Switch), and currently using Rewired for player controls – but yeah I’ve also been having a struggle getting Rewired to work with navigating the UI properly. I think i still need to do some setup.

Also to your point about tabbing with keyboard – I think from an accessibility standpoint it makes sense to allow / keep that functionality. Good to know that it basically removes it from the list.

So you’re thinking (and I’ll need to test this later today when I have time), that removing the MouseOut event (which is currently blurring the element) and add the FocusIn/Out events?

Unity - Manual: Focus events

You also mentioned PointerEvents

Unity - Manual: Pointer events

Do you have a recommendation for which ones to use? Just PointerOver?

If it matters, this is the code for updateDescriptionFor

It’s a hacky way to show properties joined in 1 Label (for now):

private void updateDescriptionFor(DifficultyLevel difficultyLevel) {
    var attributes = new List<string>() {
        difficultyLevel.name,
        $"Base fare per passenger: {difficultyLevel.baseFarePerPassenger}",
        $"baseFarePerPassenger: {difficultyLevel.baseFarePerPassenger}",
        $"tipMultiplierPerPassenger: {difficultyLevel.tipMultiplierPerPassenger}",
        $"startingVehicleHealth: {difficultyLevel.startingVehicleHealth}",
    };

    descriptionLabel.text = string.Join("\n", attributes.ToArray()); // TODO: modify this text to be more comprehensive
}

[uMathieu]

Yes, removing the explicit calls to .Focus + Blur and hook updateDescriptionFor( on both PointerOver and FocusIn events should do the trick. Mouse***Events are created from PointerEvents and should be deprecated at some point.

[alexogorek]

Even with changing the code to basically have no references to any events besides audio and click listening – the issue persists when i have tabIndex left as default.

The Focus state keeps flicking as it did in the original video. Shown in this video you can see the Pseudo States showing Focus when just moving the mouse cursor (in addition to the correctly labeled Hover state at one point)

For what it’s worth i’m running Unity Editor version 2022 . 3 . 25 f1

Edit to add: By doing this, tab on the keyboard did cycle between buttons. So i guess that was a plus haha

Screen Recording 2024 06 19 at 1 48 44 AM

[alexogorek]

Bumping this to see if there’s anything we’re missing here?

[vicenziano]

I’ve got the same issue. It seems as though the only solution is to set TabIndex to -1 as @alexogorek did.

EDIT: I have found a solution! By downloading the input system package in the package manager, this problem is no longer reproducible!

[alexogorek]

@vicenziano So wait – How did you hook things up?

Because I feel like I got myself into a weird situation where I’m trying to use Rewired for controller support on console (and PC, as well as Mouse and Keyboard support for PC). So idk if i can use the standard / standalone input system or whatever the default is.

But when you say you just downloaded it – did you have to configure anything to enable that?

[vicenziano]

Hey! Not really. I just downloaded is through the package manager. Search for “Input System” in it, making sure you’ve got the Unity Registry as source, and it should fix it :). The new input system is designed to support controllers, so I would guess it can be even better than Rewired!

[alexogorek]

Okay so I’m giving a slightly longer reply for anyone else coming across this post, and a big +1 to @vicenziano for mentioning the input system.

• Rewired can still be used in conjunction with the new Input System – we are using it for character / player controls for now. I personally have put a LOT of thought and effort into how Rewired handles edge cases with controller maps enabling/disabling, subscribing to events, etc. While it’s probably possible to do the same with the Player Manager side of the input system, we found it much easier to continue using Rewired to listen for “Player 2 input” and that come from a gamepad or whatever – and map Player 2 to a custom Player class we created.
• The Event System has a default set of actions that can be used for navigating the UI so you LITERALLY just ned to create a component with the Event System and it will magically start working, I am not kidding.
• Shown here:
  
  
• We also made sure that all of our Tab Index values were reset back 0
• We also made sure that all of our UI Documents being presented always had an element pre-focused by running the .Focus() function when showing the document
• There’s also the ability to Enable and Disable the UI navigation which is pretty nice:
  
  
• We simply put this object somewhere in the scene, hook up the Event System (mentioned earlier), then call PlayerInputManager.shared.enableUINavigation() (or disable) when we want to handle “UI” navigation differently (FOR EXAMPLE, when multiple players are selecting a character during a local coop game, we dont want just 1 button to have Focus). It’s possible we just dont fully understand the new Input System but for now we felt comfortable enabling/disabling as needed.
• We didnt change our helpers (setOnPress) at all – for some reason just having Rewired with no Event System was doing really weird thing? No idea why. But adding the Input System / Event System components literally fixed it
• Now our Settings page and the Sliders we have for volume control also aren’t wigging out / slightly shifting anymore either
• And things like multiple UI documents on screen, even grid-based UI is working as intended.
• Lastly, we STILL are using Rewired for listening for the “Back” button, which triggers a custom button press basically – so we have a helper function that assigns which Button is our “back” button, and that button just gets pressed when the back action is triggered via gamepad, using Rewired. Again, Input System might be able to handle this, but we didn’t want to get too deep into the weeds on this just yet.

Anyways – hope this helps any future devs running into this issue

[mraimbot]

I had this focus issue as well. All text was flickering and the dropdown popup’s closed immediately when opening them.

The issue was that my HOTAS joystick triggered many events all the time. So unplugging it solved the problem for now.

So I think the real issue here are the deadzones for any type of controller or joysticks in the InputSystem.

Update:
I tried the deadzone in the InputSystem but no value helped. Fortunatly I don’t need Joystick support for my game. When I remove it from the InputSystem, I don’t have this issue anymore.

[ynixt]

Unity 6000.0.41
Input System 1.13.1
Active input handling: both (I also tried Input System Package (new))

Unfortunately, the problem is still happening. Did someone find a solution different from tabIndex =-1 ?