You can implement Tabs behavior easily by using Better Toggles with the Object Activeness Transition for On / Off.


How to create Tabs


  1. Create a game object inside your Canvas called "Tabs" and another at the same hierarchy level called "Tabs Content".
  2. Add as many Toggles as Childs of "Tabs" as you need, Make them Better and design them in a way that they look like tabs.
  3. Add a Toggle Group component to "Tabs" and assign this toggle group to each Better Toggle in the "Group" field.
  4. Add as many Game Objects as Childs of "Tabs Content" as you have tabs (inside you can design the content of the tab).
  5. In every Better Toggle add a "Better Toggle Transition (On / Off)" and set it to Object Activeness.
  6. Assign the corresponding Content object to the transition and make sure that "On" is checked and "Off" is not checked.


Check out the Example Scene to see it live in action.

In the Example scene the "Tabs" is equal to Canvas -> TabArea -> Tab Grid and "Tabs Content" is equal to Canvas -> Example Content.


How to make the tabs controllable with a Gamepad


  1. Make sure there is a Better Navigation Component next to your Event System (make sure "Handle Navigation Input" is checked and "Dirty State Detection" is not "None" - if two neighboring tab contents have the same number of selectables, you may need to set it to "Check Each Selectable")
  2. As you probably want to switch tabs with shoulder or trigger buttons, you also need to add an Input Module Addition to that same game object and define the corresponding button bindings (rightclick on the Input Module and select "♠ Add Additional Button Mapping").
  3. Add a Navigation Group to the "Tabs Content" game object (alternatively, you can add a Navigation Group to every child of "Tabs Content")
  4. Add a Tab Switch Controller to the "Tabs" game object and drag the "Tabs Content" into the "Controlled Navigation Groups Parent" field. Make sure the Input Action Bindings in the settings are correct.
  5. In case you have another section that is always visible next to the tabs contents (e.g. containing an "Okay" or "Close" button):
    1. Add another Navigation Group to the that sections game object
    2. Add a Navigation Group Switch Controller somewhere (preferably to a game object that contains all navigation groups). If it doesn't contain all Navigation Groups, set the "Collection Strategy" to "Fixed Set" and assign the section's Navigation Group as well as the "Tabs Content" Navigation Group(s) to the Elements.
    3. If you also want to be able to use the tabs while focus is in that other section, also set the "Collection Strategy" of "Controlled Navigation Groups" in         the Tab Switch Controller to "Fixed Set" and assign the same Navigation Groups.