Sort buttons in unity 2D

Question

I've a list of buttons that I create using XML stored data. To achieve it, I've created a Prefab. These buttons are created correctly, and now I want them to be sorted for the user.

public List<GameObject> myButtons;

As I said, now I want to sort them. I've found out that sorting the List itself, buttons are sorted in the UI.

myButtons.Sort((x, y) => ...);

The problem is, that I don't have the necessary data to sort them within them. This leaves the .Sort() method unavailable for use.

I've tried to sort them adding an script to each one, which contains the data that I need to use to sort them. However, it doesn't work correctly and I seem unable to find out why, so I'm wondering about other more direct methods to sort them.

Notice that I'm referring to simple buttons in a 2D game, and that they're all inside the same parent/gameobject.

Technical Details

Let's start by the basics: I want to order the buttons taking into account if the user has reached a point in which the item it represents should be available.

This is stored in an instance of a class that represents the items related to the buttons of the question.

public class myItemClass
    {
        # Here there are other properties
        public bool available;
    }

Therefore, we've a correspondence between two lists:

public List<myItemClass> myItems;
public List<GameObject> myButtons;

Where:

myItems[0] is related/represented by myButtons[0]

...

NOTICE that this relation exist at the initialization of the game, so i need to keep it at any moment (meaning, having to sort both lists).

What I tried

To be able to order my buttons depending on if the items are available or not, what I've done is:

1. Creating an script myItemScript, which has a reference to my original items from the other list.
2. Sorted the items using Sort function over them.

public class myItemScript: MonoBehaviour {
    public OtherClass.myItemClass dataObject;
}

And then sorting them like:

myButtons.Sort((x, y) => y.GetComponent<myItemScript>().dataObject.available.CompareTo(x.GetComponent<myItemScript>().dataObject.available));

As I said before, both list need to be following the same order, so just after it, I order the item list as well:

myItems.Sort((x, y) => y.available.CompareTo(x.available));

Checking/Debug

As result, I found that items were in fact sorting different. However:

• Items inside myItems List were sorted as expected.
• Buttons in UI (and hence, myButtons List were not sorted as expected. Mixed items (available = true/false) were mixed and not ordered in two blocks, one first and then the other one.

This was checked using breakpoints within VS2017 and pausing the game in Unity interface.

Answer 1

To change the order of UI elements, you can use Transform.SetSiblingIndex. Be careful though, if Unity uses arrays to store child elements, changing their order will be an expensive operation.

Answer 2

It looks like you're sorting using a boolean value as your sort key. That means many items in your list will compare as equal (true == true and false == false)

When two items are equal, an unstable sort like List.Sort(Comparison<T>) is allowed to put them in any order. And it's allowed to make different decisions from one run to another (this nondeterminism is important for getting good performance from algorithms like QuickSort)

So it could put all the true items and all the false items together in both the list of items and the list of buttons, but use a different order of items within the true partition or within the false partition.

It's also strictly more work than you need. You can sort all the true items to the start of your array in linear time, deterministically:

int SortAvailableFirst(List<Item> items, List<GameObject> buttons) {
    int firstFalseIndex = 0;
    for(int i = 0; i < items.Count; i++) {
        var item = items[i];
        var button = buttons[i];
        if(item.available == false)
            continue;

        items[i] = items[firstFalseIndex];
        buttons[i] = buttons[firstFalseIndex];
        items[firstFalseIndex] = item;
        buttons[firstFalseIndex] = button;
        firstFalseIndex++;
    }

    // Return the number of available items.
    return firstFalseIndex;
}

This maintains the order of the available items, putting them at the front of the list. It does scramble the order of the unavailable items, but it scrambles them the same way when given the same sequence of trues & falses — it makes no random choices.

Or, with a little extra effort you can maintain the order of both true and false items.

Or, another way to get the order consistent is to sort your items first, then spawn your buttons in order by walking over the list of already-sorted items.