Expandable List UI button navigation

Questions & Answers
1

I’m creating an item inventory UI for an RPG game I’m making. The lists are expandable using instantiated prefab slots parented to an empty gameobject with a vertical gridlayout. Each slot has a button, so the player can navigate through the list. The navigation is controlled using a game controller.

    void LoadSlots()
    {
        if (inventory == null) return;
        if (consumables.Count != 0)
        {
            ClearList(consumablesList.transform);
            for (int i = 0; i < consumables.Count; i++)
            {
                var newSlot = Instantiate(Resources.Load<Transform>("ItemSlot"));
                newSlot.Find("Icon").GetComponent<Image>().sprite = consumables*.icon;*

newSlot.Find(“Name”).GetComponent().text = consumables*.name;*
newSlot.transform.SetParent(consumablesList.transform, false);
}
}
}
Each list is opened using toggles on the top, when toggled on. The event system sets the first child object as the navigation start point.

public void OpenConsumables()
{
consumablesList.SetActive(true);
Transform[] children = consumablesList.GetComponentsInChildren();
Debug.Log(children[1].name);
EventSystem.current.SetSelectedGameObject(children[1].gameObject);
}
The navigation starts from the top and to the bottom. When the bottom is highlighted, it won’t go any further, same for the top.
However, I’m having issues setting up a dynamic button navigation for the lists. The automatic navigation setup just isn’t working. Is there a better way to create a navigation for an expandable list.
Visual representation of the UI:
[202014-capture.png|202014]_
_

2

I wrote a code that is stored inside the prefabs. It uses get child index to find all adjacent game object in the hierachy and sets up the navigation.

using UnityEngine;
using UnityEngine.UI;

public class ButtonNavigation : MonoBehaviour
{
    Button button;
    void Start()
    {
        button= GetComponent<Button>();
    }
    void Update()
    {
        Top();
        Bottom();
    }
    void Top()
    { 
        int index = gameObject.transform.GetSiblingIndex();
        if (index == 0)
        {
            Navigation navB = button.navigation;
            navB.selectOnUp = transform.parent.GetChild(transform.parent.childCount - 1).GetComponent<Button>();
            button.navigation = navB;
            return;
        }
        if (transform.parent == null) return;
        if (transform.parent.childCount <= index - 1) return;
        Navigation nav = button.navigation;
        nav.selectOnUp = transform.parent.GetChild(index - 1).GetComponent<Button>();
        button.navigation = nav;
    }
    void Bottom()
    { 
        int index = gameObject.transform.GetSiblingIndex();
        if (transform.parent == null) return;
        if (transform.parent.childCount <= index + 1)
        {
            Navigation navT = button.navigation;
            navT.selectOnDown = transform.parent.GetChild(0).GetComponent<Button>();
            button.navigation = navT;
            return;
        }
        Navigation nav = button.navigation;
        nav.selectOnDown = transform.parent.GetChild(index + 1).GetComponent<Button>();
        button.navigation = nav;
    }
}