Game window doesn't show the same as the UI Builder (Height issue)

Unity Engine
1

3220×1558 280 KB

The containers in the UI Builder are taking the whole height of the canvas while in the game view it’s taking only half of it.

However when I change the reference DPI to 45 instead of 96 it seems to be taking the whole space. Is that normal ? What is going on ?

2

Hello! Are you setting a specific size to your VisualElement? Because if you don’t set a specific size and set flex grow to 1, it should take the whole screen, whatever the size is.
The scale mode on your PanelSettings and the reference DPI depend on what the final outcome should be for your target device, but I highly recommend checking how to layout stuff with FlexBox properly before you go around playing with values.
Hope that helps :slight_smile:

3

JuliaP_Unity I know how to layout stuff with flexbox, it’s my job :smile:.

So yeah I don’t think the problem lies there, I think something is misconfigured in my project

Fonts are not being displayed either. I’m new to unity so maybe Im missing something.

Here is the repo
https://github.com/cedvdb/drop3D (its now public)

Below is the code used, which works when copy pasted in another project

<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" xsi="http://www.w3.org/2001/XMLSchema-instance" engine="UnityEngine.UIElements" editor="UnityEditor.UIElements" noNamespaceSchemaLocation="../UIElementsSchema/UIElements.xsd" editor-extension-mode="False">
    <Style src="Test.uss" />
    <ui:VisualElement class="root">
        <ui:VisualElement class="child1" />
        <ui:VisualElement class="child2" />
    </ui:VisualElement>
</ui:UXML>

.root {
    flex-grow: 1;
    flex-shrink: 0;
    background-color: rgb(255, 147, 0);
}

.child1 {
    flex-grow: 1;
    margin: 15px;
    background-color: rgb(0, 170, 187);
}

.child2 {
    flex-grow: 1;
    margin: 15px;
    background-color: rgb(0, 255, 255);
}

PS: Although I don’t know for sure, I’ve a feeling some packages might be clashing ?

4

Hi again, awesome that you know flexbox! Many times here on the forums that’s not the case so we tend to always suggest to look that up :slight_smile:

I opened your project here and no matter what type of scale mode I use for the PanelSettings, it always seems to take the full Game View - could it be a refresh problem there? Is it fixed if you press the Play button? We’ve had some of those and are working on fixing them, but not sure what’s already live or not.

5

Nope, it is not fixed by pressing play. Something is corrupted somewhere, I’m not sure where as I’m really new to unity. I’ll try making a new project and copy paste everything to fix it.
However I suspect it has something to do with the fact that my target build was android as it’s the only thing that seems different with my test project

Is there a cache clean command

6

JuliaP_Unity Hey, so I fixed the issues by creating a new project and copy pasting the assets. I also found how to make a faulty project, this might interest you.

So to make a faulty project here is what I did:

  • add com.unity.ui to the package manager
  • install ui builder
  • uninstall unity UI and mesh pro

Then the game view isn’t the same as in the UI Builder.

I did uninstall those in my initial project because I thought those were not needed as the new ui system was the one used.

However reinstalling text mesh pro on my initial project didnt resolve the issue but I’ll keep going on the copy pasted project.

1 Like
7

Thanks for reporting back! Yes the Unity UI package should remain installed at all times, at least for now :slight_smile:
Not sure about Text Mesh Pro, but maybe recent changes created some situation there.
Good to know this could be an issue, we’ll verify internally and see if there’s something to be done about it (at least document it, of course).

8

@cedvdb can you submit a bug from the project that is broken please? That will help us track this and fix it if there’s something to fix! Thanks again

9

In the PanelSettings asset of your UIDocument, set “Scale Mode” to “Constant Pixel Size”. Try it.

1 Like