Add Numeric / Natural Sorting to SortOrder for UIListLayout and UIGridLayout

As a Roblox developer, it is currently too hard to have reliable ordering of UI elements when using UIListLayout / UIGridLayout.

Currently, layouts sort elements lexicographically (alphabetically), which means names containing numbers are sorted as strings. For example, “10” appears before “2”.

This creates a number of problems:

  • It becomes difficult to order cloned or dynamically named UI elements (“1”, “2”, “3”, “10”)
  • Developers resort to naming schemes such as “001”, “002” or prefix based naming like “A_Friends”, “B_Friends” just to achieve the correct sort order
  • These workarounds reduce readability and increase maintenance overhead, especially for larger interfaces

If Roblox is able to address this issue, it would improve my development experience because it would allow UI elements to be sorted naturally by numeric value, which is the expected behavior when element names include numbers.
It would become much easier to build data driven UI lists such as inventory slots, leaderboard entries, navigation tabs, and paginated windows, all without manual string padding or per instance LayoutOrder management.

This change would also benefit developers who rely on statically designed UI layouts in studio as they could name the frames numerically without worrying about sorting inconsistencies.

Use Cases:

  • Dynamic UI creation: Cloning frames for player lists, leaderboard entries or inventory slots.
  • Procedural tab menus: Automatically creating tabs named “Frame1”, “Frame2”, “Frame3”, etc.
  • Static designs in Studio: Designers using meaningful names for frame hierarchy without needing unorthodox methods

Example of desired behaviour:

-- UI elements named as followed:
"1", "2", "3", "10"
"Frame1", "Frame2", "Frame3", "Frame10"

-- Current behaviour (SortOrder = Name)
1, 10, 2, 3
Frame1, Frame10, Frame2, Frame3

-- Desired (SortOrder = Numeric / Natural)
1, 2, 3, 10
Frame1, Frame2, Frame3, Frame10
2 Likes

Does the LayoutOrder property not already satisfy this?
https://create.roblox.com/docs/reference/engine/classes/GuiObject#LayoutOrder

3 Likes

Using LayoutOrder sadly doesn’t fully solve this. It sorts by instance creation order which is not always the desired behaviour. (Example would be setting certain frame’s visibilitiy to false, meaning that the frame has been added to the list but having no control over its display order). Reordering later means deleting or manually adjusting multiple frames just to move one back into first place. I’ve also encountered inconsistent orders between Studio and live games when used a lot. A numeric sort would provide much more freedom and consistency when it comes to what order frames should be displayed in.

Did you actually look at the link to the documentation they provided? If you’re just changing the SortOrder of a UIListLayout/UIGridLayout to LayoutOrder, but not actually modifying the LayoutOrder property of the elements in your list then you’re going to run into the same issues.

Instead of naming your elements the order they should be in (i.e. “1”, “2”, “3”), change the LayoutOrder property to the order they should be in, with the UIListLayout/UIGridLayout’s SortOrder property set to LayoutOrder.

1 Like

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.