Could things line up by default?

Unity Engine
,
1

IMGUI Code:

public override void OnInspectorGUI() {
    EditorGUILayout.LabelField("Label");
    EditorGUILayout.PropertyField(serializedObject.FindProperty("integer"));
    EditorGUILayout.Toggle("Toggle", false);
    EditorGUILayout.PropertyField(serializedObject.FindProperty("boolean"));
}

UI Toolkit Code:

public override VisualElement CreateInspectorGUI() {
    var inspectorGUI = new VisualElement();
    inspectorGUI.Add(new Label("Label"));
    inspectorGUI.Add(new PropertyField(serializedObject.FindProperty("integer")));

    inspectorGUI.Add(new Toggle("Toggle"));
    inspectorGUI.Add(new PropertyField(serializedObject.FindProperty("boolean")));

    return inspectorGUI;
}

IMGUI result:
6650464--759649--upload_2020-12-22_18-52-4.png

UI Toolkit result (builtin):
6650464--759652--upload_2020-12-22_18-53-5.png

UI Toolkit result (preview):
6650464--759694--upload_2020-12-22_19-29-12.png

It’s gotten better in the latest preview for sure, but it’s still a bit of a disaster.

Left-margin values (sum for labels aka)
Label: 0
Integer Property Field: 3
Toggle: 3
Boolean Property Field: 3

Left-padding values (sum for labels):
Label: 0
Integer Property Field: 0
Toggle: 1
Boolean Propert Field: 0

This means that there’s three different values for where the first pixel of the label shows up.

The total height of the label is also a lot lower than the height of the other elements; 15 vs. 20.

The integer field also has some padding internally that is off, which sums up to spacing looking wrong:

6650464--759688--upload_2020-12-22_19-28-32.png

@benoitd_unity , since you’re the product manager in charge here (from what I can tell from your profile, at least!), I think you’re the right person to answer my questions;

  • Is fixing this on the roadmap? Is it a goal for the UI team that the default controls in UI Toolkit line up properly without user intervention?
  • If the answer to the first question is “yes”, what’s the timeframe? Is this a priority? Trying to gauge if I should create workarounds or just live with it for now.
1 Like
2

Hi Baste - Thanks for taking the time to build that example and share your results.

Yes you’re knocking at the right door, and these should align correctly by default. Let me see if this is already tracked and get back to you.

3

Was it already tracked?

4

No, but it is now :slight_smile:

Thank you Baste.