Search Unity

  1. Welcome to the Unity Forums! Please take the time to read our Code of Conduct to familiarize yourself with the forum rules and how to post constructively.
  2. Dismiss Notice

Any way to get rid of the border in runtime TextField?

Discussion in 'UI Toolkit' started by Steve2375, Mar 13, 2022.

  1. Steve2375

    Steve2375

    Joined:
    Mar 28, 2015
    Posts:
    42
    I would like to use the UI Toolkit during runtime. I am aware it is still in beta and has some bugs, so I am not sure if this is a bug or if I am doing something wrong: please see the screenshot, I cannot get rid of the huge border/padding above and below the text in TextFields Screenshot_39.jpg
    There is plenty of space for the text in the Textfield, but it is cut off. If I open the same UI in editor mode there is no border/padding at all and the text is fully visible.
    Is there any tag to get rid of this border? Or is this a bug and if so, when will it be fixed?
     
    Last edited: Mar 13, 2022
  2. SimonDufour

    SimonDufour

    Unity Technologies

    Joined:
    Jun 30, 2020
    Posts:
    515
    Normally, every style coming from a themeStyleSheet is overwritten by a "non themeStyleSheet" selector. I say normally because there was a bug with this on a few releases that has been patched: what version of Unity are you using?

    To find the actual values to change in the selector, you can browse the hierarchy and see the styles applied using the UI toolkit debugger:
    • window -> UI Toolkit ->Debugger
    • Use the pick element to select what you want to inspect, or use the "select a panel" dropdown to select the right one and then browse the hierarchy until you reach the element.
    You should be able to find the style that set the value. It is also possible to change the padding/margin live and see if it corrects your problem. (you can click on the value on top to edit them, or go in the list at the bottom of the window) upload_2022-3-15_14-14-19.png

    Once you know the source, if it happens to be a theme stylesheet, you could override it, but maybe it would be best to change the theme on our end. We need some default style for the controls to work, but the runtime theme should contain only the minimum required for them to work. You could possibly fill a bug suggesting to removing this extra margin, and someone will check to see if it is possible.

    We are not in beta anymore starting with 2021.2, so there should be no bugs.

    * note: there was a big refactor for the text field in 2022.2
     
  3. Steve2375

    Steve2375

    Joined:
    Mar 28, 2015
    Posts:
    42
    Hey thanks for your answer! I am using 2021.2.14 but I also tried 2022.1.0b11. afaik 2022.2 is not in beta yet.

    See the attached screenshot: I did not find any border/padding/margin that would account for that big difference between editor and runtime view. I am not sure if you have access to the Unity editor, but if yes, it takes a minute to reproduce the problem, just
    - drag&drop a text field into the ui builder and save this uxml document
    - create a panel settings object
    - create a gameobject and attach a UIDocument and link your panel settings and uxml document
    Now you can see the text field in scene view as well in game view and should see the same difference as on the screenshot.

    However I am happy to test this problem in 2022.2 if you show me how to access it.

    Thanks for your help!

    Screenshot_40.jpg
     
  4. SimonDufour

    SimonDufour

    Unity Technologies

    Joined:
    Jun 30, 2020
    Posts:
    515
    We are still in alpha, and I though that the alpha versions were public as soon as the documentation was public. No wonder the bug are always coming later than I expected. The cutoff is in a month from now, and we should be in beta soon after that.


    It seems you have picked the panel/element in the UI builder to inspect! I didn't event think to do that yet and I'm surprised it work! Just to be clear, you did inspect the one in the game view? (click on pick element + click on your text area in the game view)

    Also, the UI builder cannot know the theme used. The same UI can be use in the editor and at runtime. Because of this, if you are doing runtime UI, you should select your runtime theme in the UI builder (green square + 4 arrows). With this the UI should be identical between the builder and your game view.

    upload_2022-3-15_17-1-4.png


    Thanks for the image :)
     
  5. Steve2375

    Steve2375

    Joined:
    Mar 28, 2015
    Posts:
    42
    Ah cool, I didn't know this switch. Here is how it looks like with the runtime theme. There is no border/padding set, so I assume it is a bug, right? Screenshot_41.jpg
     
  6. SimonDufour

    SimonDufour

    Unity Technologies

    Joined:
    Jun 30, 2020
    Posts:
    515
    If you use the debugger, you will see that some style is set in the “TextInput” visual element inside the text field. It seems like it was changed/removed in the latest development version (2022.2)