UI rendering order just changed to render elements in depth-first traversal order (respecting ZIndex).
Previously if you had a text label and a image at the same Z index, the text always rendered over the image regardless of the tree structure. Now parent elements always render before children, and children render in child order, assuming ZIndex is the same - of course you can still use ZIndex to override this decision.
This update should fix various text overlapping issues in many games, but theoretically it could break something because behavior changed. Please post here if your UI does not render or function as it used to.
Fixing GUIs that were broken by this (without changing the Z-Index) requires cutting and pasting back an object back into a frame with several same level children to get it to display on top.
Whilst this is intentional, it would be great if the explorer could make it clearer what the order of children is, as it is not alphabetical in most of my UIs.
This is counter intuitive to me, as might be even worse for less experienced devs because I don’t see why this heirarchy should result in the following two ways of displaying the frame.
- As it was as a result of this change. - This required re-parenting the TextLabel as @stravant mentioned on the linked thread. But whilst this makes sense to me, it might not for a lot of people and explorer should really show the order of the children to make it crystal clear how the UI is being rendered. Such as this, where the number represents the order in which the children are being rendered.
Just my two cents anyway. The above suggestion is not super necessary for creating UIs going forward, but as copying & pasting is a way to fix broken GUIs caused by this update, making the explorer clearer would spell it out to other developers why their UI is suddenly broken.
I feel like this is not really related to this change. In your example, the heart may not be visible depending on the child order - this was the case before. In general, relying on the child order for UI is not the best idea. In your case a better solution is to parent heart & text label to the image label. The more important property of the update is that children render after parents, not that children render sequentially.
I see. This change was affecting the TextLabel rather than the ImageLabels (heart/background) and when I followed the advice in this post.
The TextLabel was rendering on top again, because it does render children sequentially.
Changing the Z-Index is definitely more intuitive but as there are a limited number, the fact that children are now rendering sequentially is quite useful.
The change is definitely more intuitive than before though, it is just that the process of fixing GUIs is a bit muddled.
Right - I agree that the sequential child render order can be useful. In general though in my mind it’s better to organize visual nesting to match instance nesting - in your UI the text and heart icon are clearly “on” the panel, so making them children feels more intuitive (and also renders correctly regardless of parent order). I did not mean that you should use ZIndex - ZIndex is indeed more limiting and requires you to think about other elements as well since it’s global, whereas making elements children of whatever they should be on top on is a local choice that does not affect other UI behavior.
when you’re 10 layers deep, you have to rely on children load order cuz max 10 zindices
it starts to get even more confusing when you have two windows with 10 layers each and you wanna make all of one window’s contents be on top of the other >:
- As it was as a result of this change.
- This required re-parenting the TextLabel as 
