Unity Version: 2020.1.0b14.4034 Personal
UI Toolkit Version: “com.unity.ui”: “1.0.0-preview.3”
UI Builder Version: “com.unity.ui.builder”: “1.0.0-preview.1”
Basically I’ve built multiple UIs (each one having its own UXML and USS file). One for dialogue, one for debug, one for pause menu, and one for battle. Each one is on a GameObject that is activated/deactivated as necessary, and each of those GameObjects are child to an empty GameObject. The Debug UI is the only one that is always enabled:
Sometimes the pause UI was in the correct position after build, others not, it seems pretty much random. Debug UI never was. In the course of writing this, I realized that it seems like the Inline USS is not being applied at all… Currently it is all inline. After extracting all of my USS on both UIs to classes (which of course is ideal anyway), they both work fine after build. Still, seems like a bug. The problem was happening with the following panel settings and uxml (uss files not provided as they were empty).
PanelSettings.Asset (which each UI is using):
%YAML 1.1
%TAG !u! tag:unity3d.com,2011:
--- !u!114 &11400000
MonoBehaviour:
m_ObjectHideFlags: 0
m_CorrespondingSourceObject: {fileID: 0}
m_PrefabInstance: {fileID: 0}
m_PrefabAsset: {fileID: 0}
m_GameObject: {fileID: 0}
m_Enabled: 1
m_EditorHideFlags: 0
m_Script: {fileID: 11500000, guid: 782f629a2df6243629ea8fe2873666a4, type: 3}
m_Name: PanelSettings
m_EditorClassIdentifier:
themeUss: {fileID: 11400000, guid: f567955c754d54a108d615cb51ccbf2f, type: 2}
m_TargetTexture: {fileID: 0}
m_ScaleMode: 0
m_Scale: 1
m_ReferenceDpi: 96
m_FallbackDpi: 96
m_ReferenceResolution: {x: 1200, y: 800}
m_ScreenMatchMode: 0
m_Match: 0
m_SortingOrder: 0
m_AtlasBlitShader: {fileID: 4800000, guid: 662b00f569c02f84bbc426d4c41ceb5e, type: 3}
m_RuntimeShader: {fileID: 4800000, guid: 1e5f18a346ed454418f93aa7eaf55791, type: 3}
m_RuntimeWorldShader: {fileID: 4800000, guid: 7082954141e3ccc43bc3b217cf12e2e0,
type: 3}
pause.uxml:
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" editor-extension-mode="False">
<ui:VisualElement style="flex-grow: 1;
flex-shrink: 0;">
<Style src="pause.uss" />
<ui:VisualElement style="width: 300px;
margin-left: auto;
margin-right: auto;
flex-grow: 0;
flex-shrink: 1;
margin-top: auto;
margin-bottom: auto;">
<ui:Button text="Resume" name="btn-resume" />
<ui:Button text="Options" />
<ui:Button text="Quit" name="btn-quit" />
</ui:VisualElement>
</ui:VisualElement>
</ui:UXML>
debug.uxml:
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" editor-extension-mode="False">
<ui:VisualElement style="width: 150px;
margin-left: auto;
flex-grow: 0;
flex-shrink: 1;
margin-top: 5px;
margin-bottom: auto;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 5px;
border-left-color: rgb(0, 0, 0);
border-right-color: rgb(0, 0, 0);
border-top-color: rgb(0, 0, 0);
border-bottom-color: rgb(0, 0, 0);
border-left-width: 1px;
border-right-width: 1px;
border-top-width: 1px;
border-bottom-width: 1px;
margin-right: 5px;
flex-direction: column;
position: absolute;
top: 0;
right: 0;
opacity: 1;">
<Style src="debug.uss" />
<ui:Label text="FPS" style="font-size: 20px;" />
<ui:VisualElement style="flex-direction: row;">
<ui:Label text="Current: " />
<ui:Label name="current-fps-label" />
</ui:VisualElement>
<ui:VisualElement style="flex-direction: row;">
<ui:Label text="Average: " />
<ui:Label name="avg-fps-label" />
</ui:VisualElement>
<ui:VisualElement style="flex-direction: row;">
<ui:Label text="Min: " />
<ui:Label name="min-fps-label" />
</ui:VisualElement>
<ui:VisualElement style="flex-direction: row;">
<ui:Label text="Max: " />
<ui:Label name="max-fps-label" />
</ui:VisualElement>
</ui:VisualElement>
</ui:UXML>
Side note: Is there any concept of Z-index for layouts, so that I can insure my pause UI always renders above the debug UI, and therefore the buttons always work?