Search Issue Tracker

Won't Fix

Votes

0

Found in

2021.3.13f1

2022.1.23f1

2022.2.0b15

2023.1.0a19

Issue ID

UUM-20877

Regression

No

Width and hight of the UI Toolkit element is rounded inconsistently when using float values

--

-

How to reproduce:
1. Open the user's attached project "U3D UIToolkit Value Rounding Issue.zip"
2. Enter the Play Mode
3. Observe the Console
4. Press Window -> UI Toolkit -> Debugger -> Pick element and press on Game View
5. Expand "VisualElement"
6. Observe each element

Expected result: height and width values are the same for each element in the UI Toolkit Debugger and in the Console
Actual result: height and width values are not the same for each element in the UI Toolkit Debugger and in the Console

Reproducible with: 2021.3.13f1, 2022.1.23f1, 2022.2.0b15, 2023.1.0a19
Couldn't test with: 2020.3.41f1 (due to compiler errors)

Reproducible on: Windows 10 Pro

Note: reproducible in all Scale Modes

  1. Resolution Note:

    There is multiples way to apply the rounding. When doing the layout, the padding, margin and border are rounded first so that both sides look the same, as they are generally narrow and slight difference would be more visible than the width. Then all the sizes are resolved (for percentages) and added keeping their float value. Finally, they are rounded to the nearest point "on the pixel grid", which is mostly equivalent to Mathf.Round if the scaling of the display is 1.

    This keeps the total value of with to be closer to the expected value, as the error could integrate if we were to do it differently. 3 element of 33.33 pixel wide will fill a 100px element without any gap. If all element were rounded to 33, there would be a 1 pixel gap.

    This is the same behavior as the browsers, but they do differ in respect to which element is 33 and which is 34 pixel wide. There are no guidelines in the CSS specification for this when we last checked.

    To get the exact same size, the user needs to keep whole values and a scaling factor of 1, or have a variable scaling factor but use a rounding similar to the RoundToPixelGrid method available at https://github.com/Unity-Technologies/UnityCsReference/blob/master/Modules/IMGUI/GUIUtility.cs

    internal static float RoundToPixelGrid(float v)
    {
    // Using same rounding constant as GUITexture::AlignPointToDevice
    const float kNearestRoundingOffset = 0.48f;
    return Mathf.Floor((v * GUIUtility.pixelsPerPoint) + kNearestRoundingOffset) / GUIUtility.pixelsPerPoint;
    }

Add comment

Log in to post comment

All about bugs

View bugs we have successfully reproduced, and vote for the bugs you want to see fixed most urgently.