Hello, first of all, I strongly recommend anyone who hasn’t tried Unity UI Toolkit yet to try it out as soon as possible and use it in their projects
Next, I would like to discuss my approach with UI Toolkit.
As you know, with UI Toolkit, a web-like approach to UI development has come to Unity. This approach offers a much more extensible and easily integratable system in different projects compared to the old system. It is scene-independent and completely modular.
My question is: In many of the demo projects that explain current Unity UI Toolkit usage, each template is loaded in a single uxml tree at once and the “display: flex | none” property of the relevant template is set to “flex” while others are set to “none”. My suggestion is to take a different approach:
-Have a single root tree (main uxml).
-Have an element called “#ContentRenderer” within it.
For example, I want to show the settings template and render Settings.uxml (settings template) within the #ContentRenderer element. I would completely remove the other templates I am not interested in from the nodes.
What are your thoughts? The problem I am trying to solve with my approach is to find and render UI elements from the directory where they are stored when needed, rather than loading all UI elements at once and taking up memory space. Would this approach overly strain the processor? Is the memory space gained worth the effort? I am very curious to hear your thoughts
When elements are at display-none, only the hierarchy and style exist. The framework does not calculate the layout, and no visuals are generated, the later being usually the most memory and cpu consuming part.
With a recent update, when an item is shown and that we’re changing do display none afterward, we keep the visuals in memory so that cpu cost is minimal they are shown again. For most platform, memory is not the bottleneck, and for games, loading a lot of visuals later may induce some form of stuttering. The requirement is different depending on uses case also. I personally want to suggest adding a few render hints to help with that in the future to guide what are we “lazily loading”
What would really be useful (essential for directing users to best practices and avoiding many false bug reports tbh) is an element that supports switching between element trees.
It’d default display: none all it’s children but the first, and then you’d call Frame.NavigateTo(int index) or Frame.NavigateTo(VisualElement child) to select which one is visible.
Bonus points for animated transitions between the trees.