#🧰┃ui-toolkit

1 messages · Page 27 of 1

thin swift
#

Use a ListView

fair herald
#

Hey Everyone, I'm trying to create a PanelSettings asset per this tutorial https://docs.unity3d.com/2021.2/Documentation/Manual/UIE-HowTo-CreateRuntimeUI.html, but the only option under right click -> UI Toolkit is to create UI Document. I also don't have Unity Default Runtime Theme under the theme dropdown in UI Builder. I'm running 2021.2, so the runtime stuff should be integrated. When I try to install the com.unity.ui package just in case, I get an error that it's incompatible with my current Unity version. Anyone have any idea how I can get to the runtime stuff?

fair herald
#

hmm, I installed 2022.1, and those features are still missing

#

oh geez, I solved it for myself. I was right-clicking in the hierarchy window or the game view. Right-click -> create in the project window has the panel settings asset.

swift stump
#

Does anyone know how to use sprites in the text above like you could with TextMeshPro? See top of the screen.

unknown.png
still lantern
swift stump
#

Is there another way to have pictures in text in UITK?

still lantern
static canyon
plush pecan
#

is there a better way of forwarding camera output to a UI element than manually making an image and setting it as backgroundImage?

static canyon
plush pecan
#

I couldn't directly set a rendertexture as the background image, that's the issue

static canyon
#

ah - I just realised I think you might not be able to set an RT as a background Image for a ve (yet?) - but you can set it for an <Image>

#

UI Builder doesn't let you add Images directly but if you edit the uxml and replace VisualElement with Image (and any corresponding closing tag), you'll then be able to set myThing.Q<Image>().image = myRT;

plush pecan
#

ah, cool, I'll try that!

simple lark
#

Hello, how can i put a viewport into my UI? I am basically trying to make an app, not a game, that utilizes a viewport within the UI, instead of the UI being on top of a viewport

still lantern
simple lark
still lantern
#

It is an easy thing to check though 😉

simple lark
#

Awesome! Thank u very much🍻 cheers man

simple lark
#

Why does the slider always revert back to 0 when clicked?

regal quarry
simple lark
#

Literally testslider.value = val

regal quarry
#

So it resets to 0 even if the default value in the builder is different(and no code affecting it)?

simple lark
#

And the val comes from vois SliderChanged(int val) thats called by the TestSlider.RegisterValueChangedCallback blabla in void Start()

simple lark
#

And then when i drag it again to lets say 4, it stays at 4

#

But when i drag again, boom 0

regal quarry
simple lark
#

It happens when i dont even have any code attached

#

It happened already before ive even created a c# script file

#

Just the ui itself

#

It has nothing to do with code

regal quarry
#

Okay. Where in the properties do you have the value set?

simple lark
#

Theres just one place

#

Top right

regal quarry
#

take a screenshot

simple lark
#

Sorry i have no wifi on my laptop atm so this will have to suffice. I dunno what u mean, u can literally make a toolkit ui file, drag a slider onto it and see for yourself. It has literally just one option to set a value. Did u ever used toolkit before?

#

I never encountered this problem in Qt, gtk, tk, sciter, kivy, delphi or any other WYSIWYG

regal quarry
#

The value is 0 though..?🤔

simple lark
#

Ah yes sorry i changed it

#

Just think of low as being 0

#

And value 6

#

Dont mind it

#

Thats not the issue, dont think im dumb. I created literal apps from scratch before haha

#

Dw i dont make such stupid

#

I only use unity infact cuz doing 3d app is too much

#

So i use 3d function of unity

regal quarry
#

Okay. Should be able to do some debugging then. Add a breakpoint in on value changed and look at the stack trace.

simple lark
#

I did already

#

Stays the same

regal quarry
#

So what changes the value to 0?

simple lark
#

Even called it on every frame

simple lark
#

xd

regal quarry
#

I mean, in code...

simple lark
#

Nothing

#

Literally touching it

#

Ahh u mean a real debug not just a log debug

regal quarry
#

Well, where in the source code does it set the value to 0?

#

a log would do as well. It should have a stack trace, no?

simple lark
#

Ok how to do that in unity, i tried turning debugger on but nothing is printed anywhere

regal quarry
#

you need to add breakpoints. It's the same as debugging any other app.

simple lark
#

And where am i supposed to put the breakpoint? The only thing i can see that i can debug is the value itself, which i did

#

I didnt invoke the slider via code, i invoked it via the WYSIWYG

#

Its not coded is literally drag n drop onto canvas

regal quarry
#

It doesn't matter if you do it via code or the editor. There's still code running behind that changes the value whether it's yours or unity's

simple lark
#

Ok i seriously have no idea on how to do that in unity

#

Yea ik but i dont know how to access it

#

I tried doing that earlier like 3 hours ago too but didnt find anything besides the debug mode thats not giving me anything

#

Like full clear log

#

Nothing

regal quarry
#

You don't even need to use the debugger for that. Just look at the first log(that says that the value is set to 0) and check it's stack trace.

simple lark
#

I use VS Code

regal quarry
#

Well, VS code is not really an IDE, so I'm not sure you can debug your code from it.

rough scarab
#

You can

regal quarry
#

So the only option left is looking at the log stack trace.

simple lark
#

It allows breakpoints

#

But i never did it like this, i only did it via running code within vs code

#

Not externally

regal quarry
#

Okay. Then either it's not configured properly, or I've no clue. Never debugged with VS code.

rough scarab
regal quarry
#

Either way, you can look at the console log stack trace with the same result

simple lark
regal quarry
#

I thought you were debugging stuff with logs..?

simple lark
#

Yes

#

Printing out on log

regal quarry
#

So you do have logs in the console?

simple lark
# regal quarry So you do have logs in the console?

No i just used Debug.Log(val) because apparently debbuging doesnt work for me rn. I setup vscode to debug and attached it but now it says since 4 minutes "Reload Script Assemblies" and i cant do anything

#

Ah now it goes further

regal quarry
simple lark
#

Yes it does put out the value, like i said

#

I did so that every frame it outputs the value of slider

regal quarry
#

well, then look at the log message, look at it's stack trace...

simple lark
#

?

#

What

regal quarry
#

Look at the stack trace(call stack) of the message

simple lark
#

I told u that it ouput the exact value of the slider and once you touch it, it said 0 until u dragged it back somewhere and then touched it again upon which it jumped back again and output 0

#

Or what

regal quarry
#

I'm not talking about the value...

#

Do you understand what a stack trace is?

simple lark
#

No

#

I just tried debugging now but it outputs nothing besides initializations

#

No changes in values

regal quarry
#

It's the chain of calls that lead to the Debug.Log call. The history of the calls. You're supposed to know things like that if you really have several apps released.

simple lark
#

Not released but made

#

One man projects that never required debugging

regal quarry
#

That's weird.

#

Anyways, if you look at the log details, you'll see the stack trace, like that:

unknown.png
simple lark
#

I dont have that tho

regal quarry
#

What do you have then?

simple lark
#

Man, i just want to know how to stop the slider from jumping back...

regal quarry
#

Well, I can't help you without you providing enough info...😅

simple lark
#

What happens if u make a toolkit file and put an INT Slider in and then press on preview and try to drag it a couple of times

#

Does it not jump back all the time?

regal quarry
#

I'm installing it now

simple lark
#

Eee thank u very much that u try it! Because ive not seen any thread on this issue. Maybe is a bug with my version of Unity?

#

I use 2021.2.7f1

regal quarry
#

It works properly for me

#

Although I'm on 2020.3

simple lark
#

Bruh

#

I feared that my version might have a bug

#

Worst thing is that i have no wifi to change version

regal quarry
#

I don't think it's the version.🤔

simple lark
#

I created a new ui file and there it works too, thats so strange! Maybe my file was just corrupted all along

regal quarry
#

Probably just messed up with some setting...

simple lark
regal quarry
#

Yeah, it does reset to 0

simple lark
#

Strange! Isnt it?

regal quarry
#

The package is still in preview, so no wonder there are bugs. If it's really a bug.

simple lark
#

It really only happens in this mode

#

I guess i will just use a label + slider then

static canyon
simple lark
static canyon
stiff talon
#

It seems UIToolkit requires InputSystemEventSystem.cs in order to work with New Input System (at least on 2020 LTS). But I can't add Hold InputAction because the script supports predefined amount of inputs. But I can use PointerUpEvent to mimic the hold action with ClickEvent and deltaTime. Is it how Hold UI Action should be implemented?

robust crater
#

I feel like this is something silly, but when I have an image in my resources folder, and I use the
background-image: resource('my_image.png');

It works in the editor, but does not appear in the build, any idea why?

#

hmm, I think I figured it out, but it feels weird / not sure why.
If they are in the same resources folder, it works as expected, so I guess the USS needs the path to be relative to itself?

#

oh nvm, that only works if I use the url('...') instead of resource('...');

#

yep, it helps to read the docs...

novel fern
#

Hi, I have a problem. I've started using UI toolkit and faced an obstacle. I don't know how to disable OnMouse*** events when object is hidden under UI. Can you help me?

last raptor
#

am trying to create tool to editor using the new Ui elements am having ObjectField the problem ObjectField doesn't persist the object after attaching it became empty again

storm horizon
#

I'm trying to create an enum field for some editor gui and it looks super broken (completely white, no label). am i doing anything wrong here?

var value = EnvironmentPrefs.Environment;
var field = new EnumField(value);
field.RegisterValueChangedCallback(evt =>
{
    EnvironmentPrefs.Environment = (EnvironmentType) evt.newValue;
});
Unity_AzZWmQfMoi.gif
#

same thing happens for DropdownField 🤔
but ToolbarButton looks fine for the two buttons to the right of the dropdown

storm horizon
#

Ended up doing it with imgui 😦. not sure why the style wasn't workin with ui elements

return new IMGUIContainer(() =>
{
    var env = (EnvironmentType) EditorGUILayout.EnumPopup
    (
        EnvironmentPrefs.Environment,
        GUILayout.Width(100)
    );
    EditorGUILayout.Space();
    
    if (GUI.changed)
        EnvironmentPrefs.Environment = env;
});
gusty estuary
#

How UI toolkit works input wise?
Is it using old input system to detect click/mousover and etc events?

ornate cliff
#

@stiff briar Don't cross-post. Also not related to this channel.

stiff briar
#

well which channel then? @ornate cliff

gusty estuary
#

Where can I find any guide on how to switch UI windows?
For example:
Main menu -> settings windows -> back to main

#

and etc

ornate cliff
#

@gusty estuary It's just logic activating and deactivating UI elements. You can find UI Toolkit examples in the pins here top right.

gusty estuary
#

What is correct approach at making multiple windows?
Do I make them as different elements within one document or different documents instead?

rose junco
#

whats ui toolkit?

rough scarab
#

Read the pinned documentation

safe forum
#

I intend on creating a tool for myself to better keep track of how scenes are connected in my sidescrolling adventure game (similar to the attached image from one of AdamCYounis videos). I'm looking into either learning editor extensions (and editor windows) or the UI Toolkit. What would you folks recommend me choose for this use-case?

unknown.png
gusty estuary
#

How to use Text Fields?
I can't seem to find anything in it's class related to allowing editing it

#

meanwhile when I simply try it out in play

#

it just gets blue

#

on click

#

and nothing else happens at all

unborn bluff
#

Hey guys, Ive got a question regarding TextMesh Pro... Im trying to customize an UI and there doenst seem to be a way to customize the dropdown list area?... Ive added a screenshot of what area I mean.

Screenshot_3.png
uneven oyster
#

It is made of normal UI images and TextMeshPro - Text components

unborn bluff
#

Im not sure how to find the way to change the colors and text styles around on this list area... as you can see everything else is stylised but the dropdown list.

unborn bluff
#

Not sure if I'm being clear, I'm quite new to this whole thing..

uneven oyster
#

you can activate it and modify it

#

and then deactivate it again

unborn bluff
#

Oh so you just need to activate it in order for the changes to be saved!

#

I will try it out, thanks a lot for the help!

uneven oyster
unborn bluff
last raptor
#

how to bind list of gameobject with list of ui elements

last raptor
#

i managed to bind a list but for some reason it doesn't save when i drag elements to the inspector

        serializedObject.FindProperty("_scriptgameObject").arraySize = root.Query<ObjectField>("GameObject").ToList().Count;
        List<ObjectField> uiGameObjects = root.Query<ObjectField>("GameObject").ToList();
        var ScriptGmaeObject = root.Q<ObjectField>("GameObject");
        for (int i = 0; i < uiGameObjects.Count; i++)
        {
            var uiGameObject = uiGameObjects[i];
            SerializedProperty _scriptgameObject = serializedObject.FindProperty("_scriptgameObject").GetArrayElementAtIndex(i);
             
            uiGameObject.BindProperty(_scriptgameObject);
            uiGameObject.RegisterValueChangedCallback(evt =>
             {
                 uiGameObject.value = evt.newValue;
                 Debug.Log(uiGameObject.value.name);

             });
        }
# 
serializedObject.ApplyModifiedProperties();

calling this at the end will solve the problem of saving but it throw error

NullReferenceException: Object reference not set to an instance of an object
#

i found the problem it was causing RegisterValueChangedCallback just be sure that uiGameObject.value is not null

gusty estuary
#

any tip which one is "row"?

unknown.png
static canyon
gusty estuary
#

uuugh

#

"direction"

#

xD

static canyon
#

yea maybe they broke it recently - I remember it previously saying. Anyway, they are in order: column, reverse column, row, reverse row

last raptor
#

reset doesn't work in ui toolkit why

last raptor
#

foldout out of the container

unknown.png
gusty estuary
#

Any idea what am I doing wrong?

unknown.png
#

basically, on it's own doc is fine

#

meanwhile nested in some other doc it's broken

summer moth
#

is there a way that I can get the UI builder to know about my PanelSettings object, so that it will include the styles and classes I have defined in a USS file attached to that and display things correctly according to that?

tulip sparrow
#

anyone know why my event.localPosition keeps jumping around between the previous value and the new value?

#

I'm assuming it's because I'm checking for changes and applying them at the wrong parts, but, I'm not sure what. I'm doing it in

        void OnPointerMoveEvent(PointerMoveEvent e)
        {
            if (e.target == slider)
            {
                Debug.Log(e.localPosition);
                slider.style.translate = new Translate(e.localPosition.x, slider.style.translate.value.y.value, slider.style.translate.value.z);
            }
        }
gusty estuary
#

Is there a way to register callback on literally any event?
Sort of make "press any button to continue"

frail wedge
#

Okay so I have an ObjectField that I'm trying to have take in a ScriptableObject. under the type section for the ObjectField I type in ScriptableObject, but it says "Type Attribute is an invalid type. Make sure to include Assemble Name." When I go to the docs for SOs it says https://docs.unity3d.com/ScriptReference/ScriptableObject.html that SO is implemented from UnityEngine.CoreModule. When I search through the Unity Assemblies I find that ScriptableObject inherits from UnityEngine.Object

SOAssembly.PNG
#

So what is the actual assembly that I'm supposed to add to the Type field in the UIBuilder ObjectField?

gusty wagon
#

Scripting button question here:
Currently I am working on generating TextMeshPro buttons at run time and the buttons themselves are being "made" but they are not rendering anything except the text of the button. Is it possible for me to generate the buttons at runtime or should I just have hidden buttons that get moved & activated at runtime?

uneven oyster
mossy geode
# frail wedge So what is the actual assembly that I'm supposed to add to the Type field in the...

Try this:
<UnityEditor.UIElements.ObjectField type="UnityEngine.ScriptableObject, UnityEngine"/>
You need an "assembly qualified name" here. There are multiple formats which might be supported. My example seems to be the simplest one. The issue is a little more complicated than usual because Unity does assembly forwarding (you access everything through UnityEngine or UnityEditor, although internally they split things into multiple dll modules). But well, it seems to work with using the forwarding assembly "UnityEngine" and also without specifiying any version.

gusty estuary
#

How to reference existing style in script?

#

Is there some sort of query for it?

still lantern
#

If that is what you mean

gusty estuary
#

actually i found it was smth about

#

element.stylesheet.Add()

#

and then element.AddExistingClass(string) or smth like that

#

ngl, it was hard to find

cloud spade
#

So I've got a whole bunch of UI I've already built using game objects and custom scripts, is there a simple way to go about attaching a style sheet to modify how those elements are displayed?

#

Also, is USS SCSS compatible? I'd think most likely but figured I'd ask

rough scarab
#

No and no. UGUI is not related to UIToolkit at all, and USS is highly specific right now while it's still just being built out properly.

cloud spade
#

Ah damn, that's unfortunate. I'll still play around with it and see if making the transition is worth it for me.

safe forum
#

Anyone know how to make it so that the objects with an .uss file get visually updated automatically when I modify my .uss file in the UI builder? They only update when I press save. Maybe there's a way to autosave?

amber iris
#

Does anyone know if UI Toolkit can be used to make custom ShaderGUI?

gusty estuary
#

any idea how to apply my style to elements of list view correctly?
I add my style .label-profile to it, it actually exists upon making item, but for some reason style wouldn't be visible.
Text is supposed to be centered, different size, no borders and etc...

unknown.png
#

nvm, I made a typo in class name

#

🙃

wanton raptor
#

How do i register a mouse click in the sceneview? Im using a script inheriting from EditorWindow and nothing seems to work

digital ocean
#

What are the general standards for usage of UIToolkit? Is it generally wise to have a new VisualAssetTree per 'UI window' (eg. main menu, settings, load world) or to have one VisualAssetTree for all of said UI windows?

static canyon
digital ocean
#

Excited to use this new system, it looks like it'll make a lot of UI management easier

digital ocean
#

I have an asset which is two labels within a container. If I use it as a nest asset within another UI Document, can I edit the two labels' text inside it without unpacking?

#

Alternatively, can I at least edit those inner labels via code?

tame agate
#

Hey

#

I'm looking for a way to add 3D elements into an UI document.

#

Is this possible?

#

Or would i be better of with the previous gameObject based UI system and put it in screen-space?

empty hornet
#

hi, im having a problem setting the background for ui, i know i can set the clear color to work around it, but i wanted to ask if im using the canvas background wrong here

unknown.png
digital ocean
#

Apparently there is a way to draw a 3D model in CSS but it's fiddly, especially without a JS engine

digital ocean
#

What you actually want is a visualElement with its background set to the colour

#

(take that with a grain of salt)

empty hornet
#

if i do that there will be bars on the top and bottom of the document cuz margins

rough scarab
#

Remove the margins then?

digital ocean
#

Is there a cleaner alternative to using
VisualTreeAsset template = AssetDatabase.LoadAssetAtPath<VisualTreeAsset>("Assets/Editor/UIRichLabelTemplate.uxml");
to load uxml files within a custom VElement?

rough scarab
#

Serialize it into the script asset

#

It's an extremely handy way to set up references with Editors and EditorWindows

digital ocean
#

Thanks

digital ocean
# rough scarab Serialize it into the script asset

Actually, I've had a go at it and can't figure out how to get Unity to allow serializing into a script asset. I can find some stuff on serializing into EditorWindow inheritors, but VisualElement doesn't seem to follow the same method

rough scarab
#

VisualTreeAsset you mean?

digital ocean
#

The script is a VisualElement inheritor, I'm trying to put a VTA reference into it, yeah

rough scarab
#

Ah, yeah that won't work. The reason it it works for editors and editor windows is because they're scriptable objects

#

Sorry for leading you down the garden path there

digital ocean
#

Ah, I assumed VE was a scriptableObject by your first response 😭

#

Oh well, hardcoded path it is I guess

#

Interesting that it's still Unity's solution to these issues. It seems fickle

gusty estuary
#

Any idea how to restore all uxml if you move them from one folder to another?

#

if they reference smth

tame agate
#

It's not ideal, but using the UI toolkit will be too much of a hassle.

digital ocean
#

Because it’s likely there’s a better way than what you’re trying to do lol

tame agate
#

You know, in Autocad or Blender, on the right top corner of your 3d view, there's this cube?

#

the one you use to rotate around or set up your Top View..

#

i want something like that

digital ocean
#

That's possible with UIToolkit as well as canvas UI

#

If using an SRP you might run into overhead issues with using a camera to render it (you also might not). In that case you can pass a fake view projection matrix to the shader

tame agate
#

Thanks, i'll try this.

#

Will also solve a lot or responsive scaling issues this way 🙂

velvet frost
#

Is the display style able to be transitioned?

#

Since in css it's not

#

And I want to animate my opacity and display so visual elements can fade in and out

digital ocean
#

This are the default UIElements sliders. They appear to only respond to MouseUp if the mouse is over them. So if you drag off them, they get stuck. This is incredibly irritating.

digital ocean
velvet frost
#

But since in UI builder it shows display in the list of transitionable properties

#

Unity probably has some way to transition it

#

Similar to how css transitions visibility ig

digital ocean
#

Wow, the source for UIElements is insanely unworkable

digital ocean
#

This is incredible. Please can someone tell me how you're supposed to register to input events within UIElements? All I want to do is get events for PointerUp regardless of where the cursor is, but I absolutely cannot figure out how this Manipulator/EventPool stuff works. It's impossible to follow

rough scarab
#

Provide some more context, why would you want to have an event that fires no matter where you click?

#

Surely you have some UI you are clicking on, do you want to know when you're not clicking on UI?

digital ocean
#

If it's not clear, I want to remedy this. Initially I was considering inheriting from the slider class to fix it, but I'm not convinced that's viable considering how spider-webby and difficult to understand the UIElements control / support classes are

#

(I'm also on the latest version of Unity 2022.1.0b4.2571 in an effort to determine if UIElements got any better since the version I was on)

rough scarab
#

I presume you're just registering a value change on it and not doing anything weird

digital ocean
#

I'm not even touching the slider. Only checking the value when preview is clicked

#

Aside from the styling and min/max/value properties it's default

rough scarab
#

Well, then their implementation probably sucks, it should use .CaptureMouse(...) until up is detected

digital ocean
#

Well, I can't find it in the source relating to sliders. I still couldn't tell you what on Earth they're doing in any of these classes though

rough scarab
#

it's sad that now UITk is back to being built-in you've got to update the engine to get any fixes

digital ocean
#

I'm... A little shocked they built it in while in this state.

The documentation is atrocious, and features just don't seem to work // work really poorly. For example I cannot for the life of me get UI Builder property fields to retain their values when you click off/back on to the element. (Eg. if "Name" were a custom field, you could change it and it would reflect that in the UXML but once you click back on the element the "Name" field is empty)

#

I was under the assumption it was production ready, but it seems it is definitively not

digital ocean
rough scarab
#

The UI builder has been less buggy as I'm using the latest 2022 version

#

but I have all sorts of annoying bugs still

#

tags not being closed by the builder causing it to just clear all the data

#

sometimes when I try to type in a field it just instantly defocuses so I can only type one letter at a time (I just do it via the UXML instead)

#

the range slider's so inconsistent and buggy that I will need to modify it somehow to make it more consistent

digital ocean
rough scarab
#

the label dragger tracks mouse delta instead of total delta so if you are rounding the field it just works extremely poorly

#

so I had to replace their dragger so it would work with rounded fields

digital ocean
#

Is the UIBuilder also kinda... slow for you? I'm not sure if that's a local issue but typing in the fields yields a 0.5-1s delay on characters actually showing up

rough scarab
#

I've not noticed

#

No maths in the UI builder fields is really stupid

#

1+1? Oh that's 11

digital ocean
#

I'm not sure if I'm missing it - but is there a way to maintain an aspect ratio on an element ala the Aspect Ratio component?

#

I encountered that issue earlier

rough scarab
#

use %'s for the width and height

digital ocean
#

The %'s are only based on the associated axis. I mean if you wanted 50% width, but then for it to be square (so the height should also be 50% width)

#

Height driven by width and vice versa

rough scarab
digital ocean
#

Oh my god

#

What is happening there??

#

The controls are in a truly horrific state

rough scarab
#

I think you have to click that bar perfectly in the center line section

#

Also I for some reason cannot click dropdowns

digital ocean
#

Me too!

rough scarab
#

I have to use the keyboard

digital ocean
#

I have a dropdown that seemingly does nothing

rough scarab
#

I'm just hoping some of it gets fixed in the next Unity update and then I can fix the rest of it myself

#

just leaving it all to the last moment, forging ahead actually making content instead of fighting

#

I fixed the label dragger though as I doubted they'd fix it

digital ocean
#

That's probably a good idea. Is there any acknowledgement of the state it's in?

#

Acknowledgement seems like a fair indicator that they're going to address it ASAP

rough scarab
#

🤷 you'd have to check the forums, but I post their occasionally and I feel like my threads are ignored so I don't bother that often

digital ocean
#

Ooft. If a community moderator is ignored, what hope is there for the little guys 😛

rough scarab
#

It's still a massive improvement on UGUI imo but it still feels early days

#

well I'm not a mod on the forums lol

digital ocean
#

I can see the potential but the implementation has definitely left me tossing up between sticking with it or jumping ship back to UGUI

#

I guess the version history of UIBuilder/UIToolkit is separate from the unity versions, but these default controls have existed for a fair while.

rough scarab
#

Yeah, I also try to do complex UI toolkit stuff in the editor every now and again and run into all sorts of major breaking issues

#

some as basic as "you cannot use arrays"

digital ocean
#

I wonder if that was fixed with the introduction of generic serialisation into (I think specifically) UI Toolkit

#

I distinctly remember building a UIToolkit custom inspector that serialized an array - actually scratch that I think I manually created a UI for the array lol

digital ocean
rough scarab
#

In the release notes, yes

#

But they've already been doing that even for packages not in the editor

rough scarab
still lantern
#

Hey, does UITK have any sort of runtime binding yet? Or is it still on the roadmap?

rough scarab
#

There is no runtime binding afaik, and I do not know if it's on a roadmap

still lantern
rough scarab
#

Yeah I have no idea as to the details of what that means. "Improve" doesn't give hope that it's runtime, but they've probably elaborated on the forums somewhere

still lantern
#

Probably somewhere. I know I saw them talking about it saying that they know it is something people want

blissful cargo
#

My current UI does not snap to safe area

#

Everytime I apply a tutorial, it pushes everything into 0,0 and removes all the anchors

#

I have tried 3 tutorials at this point 😦

safe forum
#

Is there a way of getting cursor position in GraphView? I'm trying to create GraphView.Nodes at my cursor position.

digital ocean
upbeat storm
#

Hey guys, I have two questions about the new UI Toolkit. The first question I have is whether there is support for data-binding in the same way there is for WPF, where you can bind directly to properties in a View Model from UXML? The second question I have is about document/UI switching and whether that can be done from UXML also using resources/templates (or whatever the UXML equivalent is)?

digital ocean
#

Everything I can find recommends manually binding using properties so I assume that's still the case

digital ocean
upbeat storm
#

Generally what the best practices are when navigating between UI's

digital ocean
#

Ah yeah, I had that same question myself. I ended up using a UIDocument per 'window'. You'll need to switch between them using C# either way

#

Plus modularity is probably better than monolithic documents, especially in projects with more than a single person

upbeat storm
#

I agree, as someone who like to keep in mind good programming practices (SOLID and good architecture), I definitely don't want to opt for monolithic documents 😛

#

When you say "window", are you referring to the idea of using one UI document as the base and then layering other documents on top of that and switching?

digital ocean
#

'Window' being the main menu, the settings menu, the new game menu all as separate documents

#

To switch between them I have a UIManager static that sets the UIDocument.rootVisualElement's display style to hidden

#

(IIRC)

upbeat storm
#

I'm not sure if you are familiar with Winforms or WPF but a similar approach there would be to use the main window/form as the main control and have your UI's in UserControls that can eaily be swappedout/added to you window/form

#

Ah

#

I understand

digital ocean
#

Ah it's style.visibility, not display

upbeat storm
#

So the manager will know about all the documents and just show/hide them depending on what document you want to show

digital ocean
#

Yes. In my case I call UIManager.Register("WindowName", this) on start from the documents

#

So the UIManager has a reference to every document by a name

upbeat storm
#

Interesting, that seems to the way the documentation shows as well but wouldn't that get messy at some stage?

digital ocean
#

How so?

upbeat storm
#

Especially if you have a lot of in-game UI. Imagine having menu's, inventories, shops, HUD and one script knowing about everything

digital ocean
#

The issue with having decentralised UI control is that you'll probably run into a lot of issues with UIs overriding eachother, or being shown/hidden when they shouldn't.

#

Having a centralised controller means that if something calls UIManager.Show("MyWindow"), it guarantees that only that window will be shown.

It also makes it easy to store window history (I chuck the windows in a stack when they're overridden so you can go 'back')

upbeat storm
#

Ah, that's a good idea

digital ocean
#

An 'open shop' button might call UIManager.Show("Shop") while the Shop's exit button does UIManager.Back(1)

#

If you want a confirm menu, you'd do UIManager.ShowAdditive("Confirm")

#

Really it's just a wrapper for a Dictionary<string, UIDocument>

upbeat storm
#

I was thinking of creating a state machine to manage the UI's but a stack seems like a better approach

digital ocean
#

Lol funny you say that because during a project last year one of the other programmers wanted to implement UI the same way. He then tried a stack and managed to make the most convoluted thing I've ever seen

#

I'll shoot you my UIManager code if you like, for reference.

upbeat storm
#

That would be awesome mate, thank you

#

I really like the workflow of the UI toolkit and I'm planning on using it 100% in a project that I'm doing with a friend of mine

digital ocean
#

UIToolkit is an excellent workflow, owing to its basis on webdev. It is somewhat unrefined at the moment though

#

All fixable issues, but worth noting. If you have issues with it, it's a higher than normal chance of the issue being UI Toolkit's fault

#

If anything in that script doesn't make sense, feel free to ask

upbeat storm
#

I'm hoping that it's flexible enough that you can work around most of the issues. It seems to cover a lot and you can always create custom controls if needed as well

#

Will do, I'm currently learning this technology and I need all the help/resources I can get 😛

digital ocean
upbeat storm
#

Does the slider not move with the cursor?

digital ocean
upbeat storm
#

That's bizarre

digital ocean
#

Yes, as Vertx helpfully informed it is in fact a single line of code CapturePointer() that fixes this. The PointerUp event is only usually sent to elements under the pointer, but CapturePointer forces pointer events to be relayed to the element regardless of position

#

How the devs shipped it with this issue I do not know, but hence annoying.

upbeat storm
#

I'm sure that will be fixed soon

digital ocean
#

Fingers crossed. For now you can either live with it or ofc fix it yourself

upbeat storm
#

I'm really excited about this piece of technology Unity has though and I hope they continue working on it, there are a lot systems that I could care less for and some even seem to be in buggy states but the new input system as well as UI Toolkit are fantastic tools

#

They show potential the most out of all the Unity tools in my opinion. UGUI is good but it's not a good workflow in my opinion. It's decent if you know Unity but having separation betwwen the UI and the logic/code is how it should be 😛

#

The only feature I would love is if they allowed you to write UXML in the preview window. It's good that it lets you preview the generated UXML but they should allow you to edit the UXML in there as well, rather than having to open it up in another editor. They could also go a step further and add auto-completion and intellisens for the Unity -specific commands

digital ocean
#

Only apt response is "Get more monitors, nerd" 😛

#

UI Toolkit and the input system are very nice, yes. I've been a big fan of the new input system since I first started using it

upbeat storm
#

Speaking of which, have you used both of the systems together? Linking UI Toolkit with the new input system

digital ocean
#

I don't believe it requires any particular linking

#

Nor did UGUI (except setting the event system to the new input system) iirc

upbeat storm
#

Ah

tribal void
#

Which kind of font type do I need to make it render in said font? I have TMP_Font Asset types and regular .ttf but I cant get my text to show up with that font
(while I have tested the font and it works with TMP itself, I cannot provide that font asset or its original ttf file to the Label element)

rough scarab
#

A FontAsset. It looks like it might be an old font asset type when looking through the assets menu but it's the modern one

tribal void
rough scarab
#

What am I looking at

tribal void
#

the actual font asset files

#

not showing up in the font asset selector either

rough scarab
#

Look through the asset menu again

#

And find FontAsset, not labelled TMP

tribal void
#

the asset in question i am using does not have the font asset included, it was generated with the Font Asset Creator

unknown.png
rough scarab
tribal void
#

oh, I was looking in the wrong menu

#

ok yeah, that makes sense

rough scarab
#

yahuh, not in the assets menu

tribal void
#

tbh its a little confusing to have 3 different font asset types xD

#

tho I guess TMP isnt the base text asset stuff, and considered 3rd party

#

thx! vertx to the rescue once more 🙂

bleak sorrel
#

I'm trying to debug the visual elements in the inspector by drawing a colored box on top of them
but I can't seem to make it work

private void DebugElement(EditorWindow ownerWindow, VisualElement element)
{
    Box debugBox = new Box();
    debugBox.name = "Debug Box";
    debugBox.style.position = Position.Absolute;

    debugBox.style.left = element.style.left;
    debugBox.style.top = element.style.top;
    debugBox.style.right = element.style.right;
    debugBox.style.bottom = element.style.bottom;

    debugBox.style.width = element.style.width;
    debugBox.style.height = element.style.height;

    debugBox.style.backgroundColor = Color.magenta;

    ownerWindow.rootVisualElement.Add(_debugElement);
}
#

I've never used UITK before, I'm used to GUI.Box(myRect)

#

how can I set the position and size of a box in UITK?

#

that code just produces a box with this Rect: 0,0,2,2 😓

rough scarab
#

Another .style isn't going to have values unless it's also inline. There is evaluatedStyle or something similar (I am on my phone)

#

Also overriding width and height and top, bottom, left, right seems fishy

#

Why not just use the UIToolkit debugger to debug? Why do this at all

bleak sorrel
#

@rough scarab hmm I see
yeah it's just a learning exercise to see how I can draw elements over already existing ones

#

but I don't really know how to position an element at all

#

resolvedStyle is read-only

rough scarab
bleak sorrel
#

ooooh I see

#

@rough scarab ah thanks a lot for the help! works now

#

and yeah, setting top, left, width, height is enough

#

or left,right, top,bottom

tribal void
#

so I was tinkering around with my old gameobject based UI system and noticed I was using the EventTrigger script on a few objects. Would it be possible (and a good idea) to migrate those scripts (or the underlying functions while leaving them interactable in the editor with that component)?

These buttons have PointerEnter, PointerExit and PointerDown event handlers on them (in the game object architecture) which is all I would need.

#

or is there some other way to go about attaching (dynamically in the editor) functions that need to be executed on these (without hardcoding them in separate C# files / uxmltemplates)

candid juniper
#

anyone know why I can't export my project with UI elements?

unknown.png
bleak salmon
#

Hi guys, does anybody know what is the best approach to change inbetween UI's? eg. (change from Main menu UI to Game UI)

royal belfry
#

Have the Game UI and Menu UI be on separate UI Documents

bleak salmon
royal belfry
#

as a gameobject

#

I think of UI Document Components on gameobjects as UI layers

bleak salmon
#

Okey, thank you 🙂

hard wasp
#

Hi guys, I have a couple of issues regarding UIElements (I'm using Unity 2022.1.0b5). I've created blank xml, uss files and each time I do anything I get InvalidOperationException: Collection was modified; enumeration operation may not execute. error. The syntaxs and code appears to be valid. Second issue is when checking the UI in-game it appears to be all over the place. The pictures below are from editor and in-game. Any thoughts? Should I downgrade Unity version? Thanks in advance

unknown.png unknown.png
bleak salmon
#

Hi, regarding first question have no answers. Regarding second question, what do you mean "all over the place"? For me they look the same

hard wasp
#

There is some padding on the right, text is different color, there is some padding on the top, its clearly not the same 🙂

bleak salmon
#

Do you have Runtime theme in the UI builder?

hard wasp
#

That was it! After deselecting the default theme its now rendering properly

#

Thank you a lot! Now I just need to figure out the constant errors about the collections being modified. Thanks again @bleak salmon

bleak salmon
#

Glad I could help 🙂

#

Regarding your error, I can suggest to create same project in another unity version (2021 / 2020) and see if error would appear, if its not - then it is unity problem

hard wasp
#

Thats the plan! 🙂 Thanks for your advice

tribal void
#

How do I get the #Image to be replaced on the hover event of the #Start element (which is a custom C# control class HoverButton)?
The image resource I am trying to change it into is currently located in Assets/Resources/ButtonSelected.png

HoverButton:hover #Image{
    background-image: resource("ButtonSelected.png");
}
unknown.png
#

preferably, I would place it in Assets/Menu/Resources but if that isnt possible and it needs to be in the root that isnt a big deal

#

Maybe its important I mention this is runtime code, not editor UIE

#

im aware I could do this from the C# control class but I would like to use USS for styling purposes as intended, keeping the C# side purely for the functionality to make it as dynamic as possible

bleak salmon
#

Try background-image: url('')

tribal void
# 
HoverButton:hover #Image{
    background-image: url("Resources/ButtonSelected.png");
}
unknown.png
#

The hover event works, so the USS selector is correct.
I dont know why the image does not replace tho

bleak salmon
#

I tried with normal button and it worked, but the path was quite strange. (I used unity provided arrow-down texture )

#

that's how it looks like

tribal void
#

thats a rly weird path to find an image tho 🤔

fathom valley
#

lol true

tribal void
bleak salmon
#

that is the path of custom texture
background-image: url('project://database/Assets/a.jpeg?fileID=2800000&guid=f73d2f22dc4ec0945a575121a7e421be&type=3#a');

bleak salmon
tribal void
#

I just did haha

bleak salmon
#

yes

tribal void
#

still doesnt work tho

bleak salmon
#

I think it is because of #Image

#

try #Image:hover maybe?

tribal void
#

thats not the intended behaviour tho, There is text next to the button that also needs to fire the event

#

if I dont use background-image, but -unity-background-image-tint-color it does apply the style to the button image. which is why I know the selector works

bleak salmon
#

Don't get it 😄

tribal void
#

so logically you select the C# control and then ask for an #Image child

bleak salmon
tribal void
# 
HoverButton:hover #Image {
    background-image: resource('ButtonSelected');
    -unity-background-image-tint-color: blue;
}
Unity_VUidpsJv34.gif
bleak salmon
#

hmmm, it doesn' work for me tho...

#

oh probably its because i have a class selector and you have element

tribal void
#

first is a class selector, HoverButton more than likely does not exist in your project as that is smt I made myself

bleak salmon
#

What I want to say is that when i have .buttons:hover - then it works, but when i have
.buttons:hover #login-button it stops working.
P.S my button is called #login-button

tribal void
#

and on my side a class selector doesnt work...

bleak salmon
#

how you know that?

tribal void
#

cuz i tested it?

#

I added a class selector and that didnt trigger either

bleak salmon
#

you tried complex class selector or something very simple?

#

Try create .container:hover then change background color to any random color and add it to your button. Then tell me does it work

tribal void
#

i mean yeah

#

adding colors works, as that was how I deduced the issue wasnt related to the hover pseudo selector not firing

bleak salmon
#

If #Image:hover doesn't work for you then I don't know what to do

tribal void
#

This does not work, so I guess its just a bug```css
#Image {
background-image: resource('ButtonIdle');
}

#Image:hover {
background-image: resource('ButtonSelected');
}

#

since it is showing me this but not doing it

unknown.png
bleak salmon
#

but if you instead of "resources" would choose texture in inspector then it would work or still not?

tribal void
#

still not, I cleared out the content of the classes in the USS, saved, and set the parameters in the editor without any change in the situation

bleak salmon
#

Can you show me how your uss looks like after you chose texture from the inspector?

tribal void
# 
#Image {
    background-image: resource('ButtonIdle');
}

#Image:hover {
    background-image: resource('ButtonSelected');
}
#

this is telling me that the images are valid and found, its just not replacing them for some reason

bleak salmon
#

ok it is completely different than on original button

tribal void
#

its just a standard VisualElement im handling everything functional in the C# control for the HoverButton.cs

bleak salmon
#

From what I can see on the original button, it uses ObjectFieldSelector, maybe you should try to use it to?

tribal void
#

thats what I did tho. Its the little cirlce with the dot inside it to select from the dialog popup

bleak salmon
#

hmmm

tribal void
#

I guess I'll have to post it on the forums and hope someone sees it

#

I could ask vertx, who im 90% sure will have the answer but I know tagging people outside of the convo is frowned upon

bleak salmon
#

yeah, probably you right, I have no more suggestions for you, sorry

#

vertx is somekind of guru of ui toolkit?

tribal void
#

they are one of the community moderators on the server with a fair bit of experience on UI toolkit

bleak salmon
#

roger that

unborn bluff
#

Hi,
I am new to UI-toolkit. Iam currently working on a multiplayer fps game . I need help to activate a screen in the UI.
Basically I need to instantiate button in a pannel with its text equal to player name.Please help me.

tribal void
#

hey @bleak salmon how did you find the string that also includes the fileID and guid?
I tihnk that might be what im missing but I dont know how to get that info

#

this one 'project://database/Assets/a.jpeg?fileID=2800000&guid=f73d2f22dc4ec0945a575121a7e421be&type=3#a'

bleak salmon
tribal void
#

damnit, that waasnt it

bleak salmon
tribal void
#

yeah it probabvly is, but putting that in there doesnt work anyway

bleak salmon
bleak salmon
tribal void
bleak salmon
#

It is png/jpg/jpeg textures right?

#

It just because I just tried with my texture and it worked

tribal void
#

its a png yes

#

I got it working now, somehow

bleak salmon
#

Great!

tribal void
#

I have no idea what I did to suddenly fix it

#

xD

bleak salmon
#

It is magic 😄

tribal void
#

I did remove all of the inline styling and do it purely in the USS file, which is likely the solution

bleak salmon
tribal void
#

for real?

#

thats definitly the issue then

#

yup it is

bleak salmon
#

Yeah, event if you change value from 0 to 1 then back to 0, this value won't be ovveriden. But you can right click on value name and choose Unset

tribal void
#

yea I see now

bleak salmon
tribal void
#

I didnt think it mattered that much

#

god thats an afternoon of work. just wow

bleak salmon
#

same 😄

tribal void
#

at least it works now xD

unborn bluff
bleak salmon
#

You said that you need a help to activate screen in the UI. What is the "screen" in your context?

unborn bluff
bleak salmon
bleak salmon
#

Anybody knows hot to get rid of the white text input box which appear when trying to type in the input field. I want text directly appear in the input field instead of that white extra box.

steep plover
#

Hi!
Is this the right place to ask about how to use the UI toolkit for editor tooling?
I'm trying to show the contents of a list that is not serializable by unity.

light acorn
#

Question about UI Elements and I guess sprites in general. So you can rotate a UI element like so along the Z Axis. Is there anyway to do this instead?

shrewd acorn
digital ocean
# light acorn

You'd probably be looking at modifying the vertices of the VisualElement. Something like uGUI's OnPopulateMesh / FillVBO

#

There are some scraps in the documentation that make reference to VisualElement vertices, but nothing that gives a solid idea of where or how you could do that

#

Regarding non-UIToolkit uses: yes, you can do this with a shader, or some methods like I mentioned above (Though I'm not sure if there are equivalents for sprite renderers)

tribal fable
#

Hey, wanted to see if anyone knows how to do a scrolling tiled background using UI Toolkit?

I.E. I want my texture2d for my background to wrap around and I am having trouble figuring out how to get that done with UI Toolkit.

rough scarab
#

Not sure if it's doable

#

The only way I could see it being done is entirely manually with GenerateVisualContext, allocating your own meshes and texturing them

tribal fable
#

would using a Render Texture maybe work, I haven't tested that path out yet?

rough scarab
#

Probably would but that sounds pretty disgusting 😛

tribal fable
#

let's see if that works

tribal fable
#

Okay, looked into it and I am giving up on that... I would rather just try and fake it by loading in a copy and wrapping around... probably not the best solution, but much better than trying to figure out things that go beyond my mortal understanding. Hopefully the guys developing the ui toolkit will solve it for me in the future and I can make the change.

stiff talon
#

Maybe I'm just bad at writing Custom Inspectors, but UIE make this process stupidly easy even if everything is created via code.

#

Previously I had to serialise the object, create a bunch of variable in Editor script for each property and assign everything.
Now I can just bind visual elements to public properties, and the whole thing simply works.

verbal quiver
#

I am trying to make a fade transitioner. I have one working with canvas but I want to move it over to ui toolkit. I don't like the idea of using both.

Anyway, how do I do this? I managed to create a document that has a black background and i want to tween the opacity (screenshot)

unknown.png
#

Sorry, I should add I mean how to get/set this value from code. I use DoTween's DOFade with canvas right now. But that works on Image.

#

Never mind, I got it working using a basic tweener.

tribal void
#

How do I pass a custom UxmlAttribute in a UXMLTraits class of a C# control class? closest I got was ```cs
private TypedUxmlAttributeDescription<Texture2D> Default =
new() { name = "default-image", defaultValue = null };

tribal void
#

Do I need to override that property and create a custom uxml attribute for this type?

verbal quiver
#

Does ui-toolkit have something along the lines of bindings/viewmodels? I want to populate a UI based on data (levels, high scores for these levels and progress) and rebuilding the ui every time seems like a waste.

I found bindings in the docs but they seem to apply to UnityEditor ui and also they only apply to inputs. I want to mark levels as played for example so really what I want to do is update styles and label text based on data.

rough scarab
verbal quiver
#

Shucks.

#

My fallback was UniRx. Does that sound like a terrible idea? As in, has anyone here tried that and thought "well, that was a mistake"

#

It'd come with some boilerplate, but I thought I could have central collections with observable properties. Then a "viewmodel" could subscribe to those and update ui elements. I think it'd look something like:

level.description.Subscribe(x => level.Q<Label>("level-description").text = x);
#

Which I could probably tuck away in a method.

tribal fable
verbal quiver
#

But I am still checking out the project because I'm curious

tribal fable
#

It works very well, being built on Unirx and UI Toolkit. At least for me. It also is easy installation, because I became the goto expert at my college for Unity Packages.

verbal quiver
#

I believe you 😄 I'll have a look at it tomorrow

tribal void
#

How do I pass a custom UxmlAttribute in a UXMLTraits class of a C# control class? This doesnt appear to be valid, is this not yet implemented in UITK or am I going about this the wrong way?

private TypedUxmlAttributeDescription<Texture2D> Default =
                new() { name = "default-image", defaultValue = null };
stark harness
#

Hello. I want to create UI with the toolkit. But I need it for AR. So it needs to be in canvas to be interactable with the raycast from the controller. Can be that done?

verbal quiver
#

Although it might have been implemented by now, who knows 😄

stark harness
verbal quiver
stark harness
cosmic bobcat
#

I'm unable to use fonts in the UI Toolkit in Unity 2021.2.8f1. I've tried storing the .ttf files in the Resources directory, but that's not helping. I can select the font I want inside UI builder, but it doesn't render as anything but the default font. In the second pic you can see the font selector not previewing the fonts.

font.PNG font_select.png
#

I'm not sure what's up here and haven't found anything that helps on the web, so I'd appreciate any advice.

cosmic bobcat
#

Figured it out, you must custom define it in the USS with ```css

-unity-font-definition: none;
-unity-font: resource('NEXON Football Gothic B');
verbal quiver
#

Is it just me or are the ui-toolkit docs not great?

#

I found more answers in the shadergraph package cache than I did in the docs

tribal fable
#

I am getting a strange error, wherein on startup, Unity was missing Background.FromSprite() and gave a startup error. I was able to solve it by just using Background.FromTexture2D instead.

Not sure why this happened, but was the most weird error I have ever seen.

#

this occurred after I updated visual studio unity version from 2.0.1.1 to 2.0.1.4, which is what I assuming caused the error. was weird, not sure if I could replicate the error though.

lavish scarab
#

This is an incredibly common error message I get with UI Builder, and it trips on editing many elements in the UI Builder- most commonly when modifying text that displays in an element

InvalidOperationException: Collection was modified; enumeration operation may not execute.
System.Collections.Generic.List`1+Enumerator[T].MoveNextRare () (at <cdc4992cc04a4e77a24a09cd121af77b>:0)
System.Collections.Generic.List`1+Enumerator[T].MoveNext () (at <cdc4992cc04a4e77a24a09cd121af77b>:0)
UnityEngine.UIElements.UIElementsRuntimeUtility.UpdateRuntimePanels () (at <9fb9706855a847a1926259ab0baf1b3c>:0)
UnityEngine.UIElements.UIElementsRuntimeUtilityNative.UpdateRuntimePanels () (at <05a8bc2f25e84bdebc90d31147b4881d>:0)
#

Also, is there a way to modify existing structures in UI Builder. The label inside dropdown is, vastly ugly in many situations (Also cannot find how to even change the color when necessary)

tribal fable
#

so looking at the error, somehow a runtime panel is being added during UpdateRunTimePanels

#

and that's throwing off the the Enumerator

#

It's a bit strange that the function UpdateRunTimePanels is not thread-safe, since it is expected to run during runtime.

lavish scarab
#

I did find that I can delete the label text to hide the label text from showing

but it is odd that it is not all that thread safe to cause that error (May be an issue with unity 2022). Adding a single new option on a dropdown, caused 20 errors to throw

tribal fable
#

If you want, you can try changing the code from:

foreach (BaseRuntimePanel panel in GetSortedPlayerPanels())
            {
                panel.Update();
            }```
to

var splayers = GetSortedPlayerPanels();
lock(splayers){
foreach (BaseRuntimePanel panel in splayers)
{
panel.Update();
}
}```

#

(probably not the correct solution, but should stop the error)

#

UIElements as a package is always editable.

lavish scarab
#

Unity console does not seem to want to scope to it in Visual Studio

tribal fable
#

open up the package inside your project folder system and type runtime in search, you will find the script.

#

Honestly, I have no clue how ui-toolkit works. Sufficiently advanced code is magic.

#

That's why I am loathe to touch stuff

#

but that should stop the error, however, it might just delay the error to somewhere else

lavish scarab
#

I can only even find "Unity UI", but thought that was a different package

Toolkit is one I want to get used to, since it is more close to home being based on HTML/CSS

tribal fable
#

Right now, in order to do a mask, I have to use a scrollview

lavish scarab
#

Personally, where it is now is plentiful - if I can figure out how to get dropdown's to work (Made the options "option 1, option 2...") but they don't seem to do anything on click

tribal fable
#

are you programming the dropdowns yourself or are you borrowing code, cause I don't think dropdowns are standard?

lavish scarab
#

Not even touching code yet- just UI Builder (Literally first day using UI Toolkit)

tribal fable
#

so a dropdown, would probably be a combination of a foldout and a label. You populate the foldout with buttons for selecting things.

lavish scarab
#

there's a dropdown element in UI Builder...

tribal fable
#

Oh, I am using an older version

#

wait no i am not, I don't see it

lavish scarab
tribal fable
#

oh, I know your problem, I think. There're some options that are editor only

#

check the top right three dots

#

and remove editor extension authoring

#

no wait, I don't have those

#

oh... it's unity version

lavish scarab
#

I clicked that, and it actually added even more elements after it

rough scarab
#

UIToolkit isn't particularly stable on any version

lavish scarab
#

I can believe that

tribal fable
#

yeah, I didn't know I was missing features because I am using a LTS version of Unity

#

I mean, I probably should upgrade my project if I need features

#

it shouldn't be that bad for upgrading

lavish scarab
#

unity 2022's usage of .net 8 is, really helpful to me... so i have been sticking with it

rough scarab
#

Definitely, UIToolkit is built-in now, so only by updating the engine can you get new updates

lavish scarab
#

yeah, built in for 2022,

tribal fable
#

just stuck here using 2020

rough scarab
tribal fable
#

for absolutely no reason

lavish scarab
#

Do you have experience using the dropdown in 2022.1? I am having just a tiny bit of trouble getting it to actually popup the choices on click

rough scarab
#

It doesn't work for me either

#

I'm just waiting for them to fix it

#

you can interact with the keyboard in the meantime

tribal fable
#

or you can create your own dropdown

#

I mean, that's what I will probably end up doing (haha, 2020)

lavish scarab
#

Most I am looking to self-create is a generic tool-tip (Had one working for whatever the original UI system is called)

#

it is odd though, that the most basic action of click activate does not run it, yet click followed by [return/enter] opens it up

#

WAIT, would it be possible to create a simple script that in general on click of dropdown, would trigger whatever the dropdown open command is as a temporary fix? (and make a template off that). It recognizes a click in general, as it focuses in on it

rough scarab
#

is how I use it

unknown.png
#

There are definitely better implementations out there

lavish scarab
#

Thanks, I will consider using it.

rough scarab
#

There will likely be minor places where the code won't compile, I think one is just a the name of the uss class I use for the toolkip, I haven't checked properly, just consider it an example 😄

lavish scarab
#

Imma try updating from 2022.1.b6 to 2022.1.b7 to see if that solves some issues

lavish scarab
#

that would be a negatory

lavish scarab
#

if I am going to make a popup element, say a menu that is not reliant on anything, do i make that as a separate ui document or is there some method like html5’s template?

tribal fable
#

Not Seperate UI Document, seperate Visual Tree Asset

#

UI Document = Visual Tree Asset + Styling

#

You can make either a template or you can use a UXML Factory to define it via code

#

The code one, let's you add in manipulators by default or have additional customization/styling settings

#

the Template is you get what you get

lavish scarab
#

Ah, ok

tribal fable
#

It works by having a toggle and a visual element container, whenever the value of the toggle changes, it changes the flex mode of the container to be flex or none. It registers those two things to the hierarchy and adds the additional settings via UXMLTraits that adds the UXMLFactory for it's settings

lavish scarab
#

I just learned i can double click any label in the editor, and type replacement text for it without any errors going. Now if only changing the Name in the inspector didn’t cause it (i think it is caused by the rendering engine trying to render it with every, single, little, value, change- so two threads accessing a single variable at the same time… Is there an option to not live update and only after change?)

inland laurel
#

Howdy, all. I started up a project with the intent of trying out the UITK with the New Input System, as I saw that the former supported the latter now. I'm on a new project, 2021.2.9f1, and I've done the following:

  • Created the Panel Settings for UITK.
  • Switched to the New Input System in Project Settings > Player.
  • Made a sample Visual Tree Asset with a button.
  • Created a script which ties a callback to that button when clicked.
  • Placed the Visual Tree Asset in an empty Game Object + put the script on the object.

I've got pretty much nothing else in the hierarchy, just the camera and the HUD object which contains the VTA and the script. Nevertheless, I get the following error:

InvalidOperationException: You are trying to read Input using the UnityEngine.Input class, but you have switched active Input handling to Input System package in Player Settings.
UnityEngine.UIElements.DefaultEventSystem+Input.GetAxisRaw (System.String axis) (at <40001ab788e241b094dbea03f2ab96e8>:0)
UnityEngine.UIElements.DefaultEventSystem.GetRawMoveVector () (at <40001ab788e241b094dbea03f2ab96e8>:0)
UnityEngine.UIElements.DefaultEventSystem.ShouldSendMoveFromInput () (at <40001ab788e241b094dbea03f2ab96e8>:0)
UnityEngine.UIElements.DefaultEventSystem.SendInputEvents () (at <40001ab788e241b094dbea03f2ab96e8>:0)
UnityEngine.UIElements.DefaultEventSystem.Update (UnityEngine.UIElements.DefaultEventSystem+UpdateMode updateMode) (at <40001ab788e241b094dbea03f2ab96e8>:0)
UnityEngine.UIElements.UIElementsRuntimeUtility.UpdateRuntimePanels () (at <40001ab788e241b094dbea03f2ab96e8>:0)
UnityEngine.UIElements.UIElementsRuntimeUtilityNative.UpdateRuntimePanels () (at <022e0d17f3324664894729afe55099b0>:0)

This is similar to other errors on the first line, and I've looked through them, but none seem to be related explicitly to the UITK. Do I need to add some kind of event handler or something?

lavish scarab
inland laurel
#

I'm not exactly sure what you mean: in the Project Settings, under the Input Manager tab? Or the Player Tab? I've switched my Active Input Handling over to the Input System Package (New) in the Player Tab.

rough scarab
#

Find the EventSystem in your scene and make sure it has been switched.

inland laurel
#

Ah, one wasn't created --- I thought that was only for the old UI system? Should I create one if it doesn't exist?

rough scarab
#

Yes

inland laurel
#

It seems to be okay with everything --- but I'm not exactly sure what I'm looking for, to see if it's switched.

unknown.png
rough scarab
#

That's weird, it should be prompting you to switch

lavish scarab
#

delete that one, and try and spawn one in via adding a temporary canvas?

rough scarab
#

it should be using the InputSystemUIInputModule instead of the Standalone one, but it was a click of a button on that interface to switch mine for me

inland laurel
#

I get the same thing attempting the temp canvas thing. No prompt. Hm. I can try to make a new project, make an event system thing first, and see if that works out better, maybe.

#

Oh, maybe I can just add the component then?

lavish scarab
#

this is what it would be looking like if it worked right :/

IMG_1167.png
inland laurel
#

That'd certainly be sweet to have. Haha, lemme try with a new project, I'll make an event system right away.

lavish scarab
#

try removing and re-adding the new input system, switch player active input setting?

inland laurel
#

Yeah, nothing, totally new project, tried toggling new input on and off, canvas-created event system and otherwise. Okay, but at least I know what I can google now. Lemme look around a bit and see why this "Replace with InputSystemUIInputModule" isn't coming up.

#

Though, actually, this should have been fixed after the alphas. So, I dunno actually. But this does seem to be my issue.

lavish scarab
#

have you tried a LTS version of Unity? (only time i’ve used the new input system was in those)

#

2020.3.28F1 is the newest marked one atm

inland laurel
#

Solution to my above problem: The version of the the Input System packaged with 2021.2.9f1 is 1.2.0. The earliest package which works with the UITK seems to be 1.3.0, which does not appear yet in the package manager, but can be added via "Package Name" with com.unity.inputsystem and version 1.3.0.

This seems to give Unity a kick and allows the EventSystem thing to pop up. A pretty silly thing to miss, but at least it's really easy to fix.

lavish scarab
#

ah, nice - but odd miss most certainly

inland laurel
#

Yeah, kind of strange --- I didn't see anyone say this before in the forums. I wonder if I'm just on one of the weird versions that didn't put it to 1.3.0 automatically. Who knows.

#

Either way, thanks for your help, y'all!

lavish scarab
#

None of the 3 settings elements added will show, unless I manually re-add the 3 style changes (position & left/top) (pp = post processing)

    private void Start() {
        root = GetComponent<UIDocument>().rootVisualElement;

        micButton = root.Q<Button>("MicSettings_Button");
        avatarButton = root.Q<Button>("AvatarSettings_Button");
        ppButton = root.Q<Button>("PostProcess_Button");

        micButton.RegisterCallback<ClickEvent>(ev => PressMic());
        avatarButton.RegisterCallback<ClickEvent>(ev => PressAvatar());
        ppButton.RegisterCallback<ClickEvent>(ev => PressPP());

        micSettings = micSettingsTemplate.CloneTree();
        avatarSettings = avatarSettingsTemplate.CloneTree();
        ppSettings = ppSettingsTemplate.CloneTree();

    }



    private void Update() {
        if (!hasFlipped) {
            hasFlipped = true;

            root.Add(micSettings);
            root.Add(avatarSettings);
            root.Add(ppSettings);

            micSettings.style.position = Position.Absolute;
            micSettings.style.left = new StyleLength(new Length(400, LengthUnit.Pixel));
            micSettings.style.top = new StyleLength(new Length(400, LengthUnit.Pixel));
        }
    }
thorny rain
#

How do i make it if i hold my mouse and hover it to my left button it clicks it

unknown.png
#

I don't know the keyword for this specific thing so please help

#

Basically if i hold and hover to the next button it will trigger the button hovered

#

Like a slider but with 2 buttons

tribal fable
#

So… the idea is to have it so that while you are hovering over the thing does a thing. You can use visualElement.RegisterCallback<PointerEnterEvent>(callback); to register an event that occurs when you first put the pointer over and do the same for PointExitEvent.

#

And that callback can start a Coroutine or something that you cancel when you exit. Wherein you call some updoot function.

rigid veldt
#

Hello everyone,

#

I'm thinking of learning a gui framework something like maui / noesis gui / unity ui element..

which one would you pick & why?

I'm thinking of noesis gui because it's cross platform and support vs design also vector rendering. also true native towards gamedevs ,

but maui has more functionality like native api using .net5 BCL also akain to blazor binding it could intergrate with blazor but require asp core and some background in razor .

I think no doubt unity element is necessary for GUI and extensions development .

copper solar
#

Does anyone have some material on doing but more fancy stuff with UI toolkit, as Foldout right, instead of folding out towards bottom. Or any tutorials and etc. As for Now I can only find things like basic tutorials, but cant find more specific data there.

#

or things like how to add animation of foldout and etc

lavish scarab
tribal fable
#

you can get the foldout to foldout right through style sheets.

lavish scarab
#

Does anyone know if it is possible to use the Dark Editor Theme for UI Toolkit (outside of just the editor- so that it shows up that way in game)

#

whatever it is using for the base text and ui looks real nice and clean - besides the fact that sliders are broke

#

i am also not able to modify the USS for base controls (like .unity-base-field_input)

tribal fable
#

strange, in my version, I am able to quite easily. Like that is the whole purpose. Check that you don't have [control-name]:active or [control-name]:focus overriding in the debugger

lavish scarab
#

none of that in my USS. When I hover over the selector in the builder, it doesn’t even highlight the elements associated with the class name

tribal fable
#

I don't know, seems like something that I would need to be in the driver's seat to debug

#

you can try adding your own custom-selector and then doing subselections

#

like .myFoldout > #content

lavish scarab
#

can’t modify the children of template based classes (built in ui tools like dropbox or toggle) to add my own class selectors :/ which is why I am trying to modify existing ones

# 
.RootWindow {
    background-color: rgb(38, 38, 38);
    border-left-width: 2px;
    border-right-width: 2px;
    border-top-width: 2px;
    border-bottom-width: 2px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    color: rgb(163, 194, 214);
    border-left-color: rgb(72, 72, 72);
    border-right-color: rgb(72, 72, 72);
    border-top-color: rgb(72, 72, 72);
    border-bottom-color: rgb(72, 72, 72);
}

.unity-label, .unity-text-element {
    color: rgb(163, 194, 214);
}

.unity-base-field_input, .unity-toggle_input {
    background-color: rgb(72, 0, 0);
}
#

label and text element work fine too (which makes it kind of more odd)

tribal fable
#

one thing I would like if unity added would be something like sass.

#

Something like preprocessing for style-sheets.

lavish scarab
#

Would be nice- but that is a long ways away from what I can tell

tribal fable
#

with similar syntax and all

#

heck, I bet you, I could build that, in say, three weeks, if I wasn't busy with other things.

#

since, we have ui toolkit source and all

lavish scarab
#

and then they rewrite half that base of USS XD

tribal fable
#

yeah... I hate supporting Unity as it is rarely stable on anything

#

what I would probably do is rewrite a subsection of PanelSettings that applies all the preprocessor defines. And then the PanelSettings would serialize them all out so you can set it on Panel.

#

and within the builder, I would just add a new window with those settings.

#

something like that seems like a good place to start figuring it out, but hey, might be a bad idea

#

make it 6 weeks

lavish scarab
#

The more important thing I would force in a fix, is that the prebuilt tools are imported as optionally either template or fresh (template, you can't modify the children- but "fresh" would be as if you set it up all yourself and have fully GUI control of it)

#

no way to modify the children of toggle for me in my version of Unity, where even the USS selectors just flat out fail

unknown.png
tribal fable
#

anyway, I am going on roadmap page and putting out an Sass precompile equivalent suggestion for UI.

lavish scarab
#

GL. It is a smart thing to add, SASS makes a ton of work simplified

#

or I guess, it may be SUSS for Unity xD

tribal fable
#

Syntactical Unity Style Sheets

lavish scarab
#

SyntacticallyAwesome
Unity
Style
Sheets

tribal fable
#

I am hoping they keep the SUSS for the meme if they do make it, because it would be hilarious.

lavish scarab
#

idk, sauss sounds kinda suss too

tribal fable
#

SAUSS isn't bad either

lavish scarab
#

sometimes, you just gotta pour on a little SAUSS to your game

tribal fable
#

Haha, I really hope someone at Unity is listening to this conversation, because it is actually a real nice feature.

copper solar
#

all your talks sounds SUS to me >.>

copper solar
#

How to edit premade buttons. For example i can add Radio button, but I want to change #unity-checkmark, but it is grayout and I cant change anything or change style at all.

copper solar
#

And same goes with every single premade thing. only button is customisable as it dont have enything inside

copper solar
#

Anyone have examples scenes or UI examples for tool kit? I kinda too lazy to code everything from scratch 😄

copper solar
copper solar
#

I guess manually adding

.unity-radio-button__checkmark {
    //stuff to change

}```
 works, but it isnt very nice 😄
#

but that doesnt let me have unique radio button, for example have a bit different from others >.>

lavish scarab
#

use the # followed by sub-component name 🤦‍♂️ i only just realized it. I’ve been trying to call the classes in USS this whole time (which logically should work - but don’t, or at least for my version of Unity it doesn’t still)

copper solar
#

I will try, thank you

#

well it works, how to indentity more precisely. For example have two sliders:
#unity-dragger which name I cannot change, and cant change class. Only thing I can change is like parent.parent.parent name 😄

#

as changing this ID parameters literally changes all UNITY sliders for me :DDDDDDDD

#

when you change 1️⃣ but end up changing all unity UI builder style :DDDDD

#

nwm found out 😄
same as in css
just write parent name next to child name 😄 but it is pretty cool i can change my unity editor style now

lavish scarab
#

yeah, it’s a bit of a pain but it’s nice as you get more used to it. Sadly, it’s still very well in early development after 2 years (mine has so many issues, for unity 2022.1.b6)

rough scarab
copper solar
#

but it is till better than default unity UI 😄 I am loving it 😄

rough scarab
#

Add a class to the root element and then target a descendant with the name or a class

copper solar
lavish scarab
#

Are the pre-fixes necessary when manually writing the uxml? I’ve seen some prefixed with VisualElement:, united prefixes them all with ui:, and unity docs show no prefix…
<Label />
<ui:Label />

rough scarab
lavish scarab
#

Yeah, that's where I saw it without the ui prefix's, and I wasn't sure if either or were out of date or something. Just makes it look even more odd compared to what Unity auto-generates with UI Builder

copper solar
#

when a slider is draged whihc sub class is on? Active? selected? as hover dont work as I expected

#

as debuger states tehre is no Pseudo classes when draging

copper solar
#

One more question, how is UI toolkit handles Japanese and chinese symbols. As I gues it uses text mesh pro, and for example in webgl you need a lot of work to have nice text with text mesh pro.

#

that a lot of work is create FontAsset, which is not friendly if you missing some kanji\

#

and it dont let me chenge Inter-Reugal SDF (FontAsset)

copper solar
#

things like this happens.

one is more bold than another. Tried different fonts, same problem. any tips?

unknown.png
cursive escarp
#

Finding the sparse docs and simple examples lacking in guidance for what I'm trying to do.

#

Seems like I'm supposed to override the create method in the factory to build the more complex list view. (No example I've found does this 🤷‍♂️ ), but it seems to work in UI Builder.

#

Also I'm inheriting from ListView to try to get all its attributes to start, but they're not showing up 🤔

tribal fable
#

this shows some examples of custom ui elements

cursive escarp
#

ahh ok, so I'm not supposed to build the hierarchy in factory

#

very helpful. thank you.

tribal fable
#

Make something simple, then make some more complex, then make the thing you want... that's how I end up learning systems, so that's what I recommend.

lavish scarab
#

is there a setting somewhere that I am missing, to disable arrow keys from moving across visual element inputs?

tribal fable
#

?

lavish scarab
#

if i enter an input (text box for example), arrow keys will start moving between others as if it were tab

tribal fable
#

I don't know. I am not sure, but probably is connected to the Input System so as to allow for easy non-mouse gameplay with UI

#

Controllers and the like.

lavish scarab
#

i’m fine with keeping tab key for that, but arrow keys could be useful to reclaim as functional keys (i’m making software, not game)

tribal fable
#

If you doing it with Unity's New Input System, maybe check out the input module and just don't set something

lavish scarab
#

i haven’t even switched it over to new unity input system 😅 (i like it, but getting inputs can be a b’ sometimes; compared to dropping a Input.KeyPress sometimes - but i probably should)

tribal fable
#

There is a way to do that with the new Unity Input System if you build out a container, but in general, it leads into bad code...

#

Personally, I like Using Unirx observer streams for everything as there is a lot of small changes you can quickly change to make it easy.

#

At least a webGL build

lavish scarab
#

sounds like fun 🙂 😅

tribal fable
#

it's a concept for a trippy 2D rubix cube. I have a level builder and anything, though I can't really show that off, because I don't have a level select yet.

#

luckily, this is just a school project

lavish scarab
#

all I have so far after 2 days since starting fresh on my project are - instantiating a properties panel, and transform controls (pos/rot/scale)

tribal fable
#

yeah, this has been around 3 weeks of development so far... but on a part time basis

#

and it technically is a group project, but... the team is 3 artists

#

and me

#

all of them know how to code, but actively avoid it most of the time.

lavish scarab
#

i know that feeling - except i usually got stuck without anyone wanting to do anything and then just me dropping the entire project a month later (not school, that stuffs too expensive 4 me)

tribal fable
#

I really hate working with my fellow college students on projects, just because around 90% of them don't program in their off-time, so they haven't developed out the sense for coding the 'correct way' (pre-style)

#

the 'correct way' refers to actively thinking about how you are coding while you are coding

#

and is mostly about learning tons of patterns

#

there is no "correct way" to style your code, but there is a 'correct way' to code.

lavish scarab
#

a right way to stylize and format code, but not exactly a wrong way to lay it out?

tribal fable
#

what I am talking about is that they don't think about how to interact with their own code

#

So, a lot of them end up using 1-time hacks that brings things to a crawl

#

and would've been avoided if they thought it through as they coded

#

the 'correct way' to code is to code with the expectation that someone is going to read it

#

and use it

#

and change it

lavish scarab
#

ah, yeah. That seems to be a very common problem - along with code anticipation, potential methods to add ahead of time.

tribal fable
#

it is a common problem... but a couple minutes of thinking through hypotheticals results in code that is easy to upgrade and maintain.

lavish scarab
#

but your also in school - minimum work for passing grade

tribal fable
#

The classes that tend to work out the best are the graduate level ones wherein everyone tries one-up-man-shipping

#

I think, in general, at a certain point, you can't be taught programming as much as you just have to experience it

#

nywy g2g 4real

fiery mountain
#

I was working with the ui builder in the past and I was able to reference sprites/textures directly for setting a background image of a visual element. Now it seems to break my uxml file. I noticed if I put the sprite into resources it works. So is this the only way to use sprites in the UI now? or is something broken for me? Or can I only change sprites at runtime?

weak axle
#

Hey, is there any way to use the new input system with the ui toolkit. I tried putting the ui into my project but it gets an error with the You are trying to read Input using the UnityEngine.Input class, but you have switched active Input handling to Input System package in Player Settings.. I was wondering if there is any way to get them to work together yet.

gusty estuary
#

Is there a way to check for specific style of visual element through name?
So let's say I have empty class .label-autosizable
Which I want to use as tag. Now I want to find all labels with this class and only with this class.
How can I check do it?

rough scarab
#

Construct a Query with that class

gusty estuary
# 
        var query = this.Query<Label>(className: "label-gamescreen");
        query.Build();
        autoSizedLabels = query.ToList().ToArray();

yepp, took some time to figure out

gusty estuary
#

hmm

#

any idea why I can't put TextMeshPro font asset into Label FontAsset property?

#

it's just empty

unknown.png
#

and I can't drag SDF file as well

rough scarab
#

Use a FontAsset

gusty estuary
#

you mean TMP font asset won't work?

gusty estuary
#

Is there a way to define custom variables to USS Class?

#

Basically I want to have Text class that will have 2 custom properties

#

width and height relative size, so my custom containers will auto adjust all elements text font size depending on those 2

#

and I don't want to define custom Label Visual Element for it

sudden quest
#

Hey there, i have weird problem that scroll rect of built in ui canvas, breaks when scrolling down, just on android.
more info here(i opened post there yesterday)
https://forum.unity.com/threads/scroll-view-rect-breaks-on-android.1242772/

i suspect it might be some bug in version of unity that i updated to(2021.2.11f1) because it didnt happen before, but maybe there is known solution

if anyone has idea, that will be cool 🙂

Unity Forum
Scroll View/Rect breaks on android

Hey, i made a game once in 2019 with unity 2019 and everything was good.
I decided to make a small update to game, and upgraded to unity 2021.2.11f1 as...

copper solar
#

by the way, idk where I should report this, as it is insignificant , but still an error in Documentation.

unknown.png
rough scarab
copper solar
#

ty

copper solar
# 
 TeleportListView.makeItem = () => {
            Debug.Log("NewUI FillTeleportList. Making items");
            // Instantiate the UXML template for the entry
            var newListEntry = m_ListEntryTemplate.Instantiate();
}

is logic if we want to add data to ListViewObject, but what should be if I just want to add to ScrollView element? is there any special function for it?

#

Well there is .Add(newListEntry ), but that wont do all other functions as setting values and etc.

TeleportList.Add = () => {

}```
#

I wanted to make horizontal ListView, but was not able to make it look pretty, like disable the scroll bars and etc. And selection editing was challenging. so simpler ScrollView as enough for me. Unless there are some tips on handling it?

distant pewter
#

Hello! In the Unity UI, in the Image settings, there was such an item "Pixel Per Unit Multiplie". It allowed the Sprite to be scaled in "Sliced" mode. Is there something similar in UI Builder? I've now selected the background of a VisualElement and can't adjust the scale of a sprite that has "slice" margins set.

cursive escarp
distant pewter
# cursive escarp <@558630070948986911> https://docs.unity3d.com/Packages/com.unity.ui.builder@1.0...

Um... There is no answer on this page. It says here that there is support for 9-slicing in sprites. However, a sprite cut in this way cannot be scaled in the 2D Sprite Editor, as it was possible in the Unity UI with the "Pixel Per Unit Multiplie" option.
As a result, the entire area of the VisualElement is occupied by the corners of a large sprite, since the sprite itself has dimensions of about 1400 pixels.

#

Here's what the sprite looks like in the VisualElement in the background. This is what a sprite looks like in the sprite editor with 9-slice enabled. How to fix it?

SPOILER_unknown.png SPOILER_unknown.png
cursive escarp
copper solar
#

VerticalScroller = rootVisualElement.Q<Scroller>("unity-slider");
So I know that there are two Scrollers in root visual element, how do I select second one? I cannot change the names because they are grayout as it is ScrollView element.

rough scarab
#

or you can use .Query to build a more advanced query

copper solar
rough scarab
#

Just use the classes provided by the ScrollView so you're not hard coding things unnecessarily

copper solar
#

ohhhm thank you <3, missunderstood:)

rough scarab
#

But yes, if the name is "unity-slider" that should work

#

Also the ScrollView itself contains references to its Scrollers

copper solar
#

any tips how should I approach idea that I want to scroll to selected element. Besides using proportions? Aka if selected item is 3rd in the list, I should scroll 1/3 of max value?

rough scarab
copper solar
#

thank you ^^ I learned a lot

copper solar
#

Another question. It about events.
CarouselItem.RegisterCallback<ClickEvent>(ev => SelectItem()); this is most generic way to create a button press. And I understand how it works inside class. But what happens if I want to have this script in a class which is not monobehavior, and is assigned to Visual element?
To explain more:
Parent class -> ScrollList
Child class -> ListElement
It is initialized during runtime. Visual class elements are generated and assigned with ListElement class, so I could change values inside from parent Element. So when going from up to down in a tree it is simple, but what happens if I want to register event callback on that button to run function in Parent class.

A) should I assign those buttons on Parent class (SCroll list) when I am initiating them?
B) there is a a global access to events registered in any of classes?
C) I can somohow access parent class function from child class.

In object programing I would just take parent gameobject and access script, but with UI builder I am not sure about best method

copper solar
#

As I want to on button click get data from that button.

#

In List view I could get it just by getting selected parameter, but inScrollView that is not an option, so I am trying to return the Visual Element of the button. I tohught ev.target or ev.currentTarget will work, but I missunderstood it.

distant pewter
# cursive escarp

This setting does not scale. A clips and distorts an existing sprite. In your screen recordings, you can see that in the first case, the corners and side edges are scaled, and in the second case (with a change in the Slice parameter) they are cut off and distorted.
For example, when setting the value to "1" of the "Slice" parameter, something normal is obtained, but 9-slice no longer works and the sprite is completely distorted.
And if you set "10", then the sprite is distorted. And the 9-slice mode doesn't work either.

ezgif-2-aa008052bd.gif ezgif-2-c3547e0a4d.gif
#

For an example of how it works in Unity UI. This is what I want to achieve from the UI Toolkit.

ezgif-2-01eaf77302.gif
keen widget
# 
 // Instantiate the UXML template for the entry
    var newListEntry = m_ListEntryTemplate.Instantiate();

    // Instantiate a controller for the data
    var newListEntryLogic = new CharacterListEntryController();

    // Assign the controller script to the visual element
    newListEntry.userData = newListEntryLogic;

what is the difference between this and Binding?

#

Or is it binding can bind monobehaviours and game objects, and userData just adds Class to the UI element??

hybrid galleon
tight fulcrum
#

how to make this text better to fit in camera without problems?
I would need to make it all a lot bigger, and with Font Size 1 it isn't visible

unknown.png
thin coral
#

Use TextMeshPro, not the Text component.

#

If you want to see it on the screen space, use a Screenspace Canvas and a TextMeshPro UI object.

tight fulcrum
#

Thanks

dreamy kelp
#

Hello there. I have a question about a prefab being instantiated inside a grid list (in a canvas). Whenever I change my resolution of the game, the prefab keeps the old size and appears bigger or smaller. Usually I solve these type of problems by setting the rect transform to inherit the parent's size and stay relative to that one. But the Grid view does automatically set the orientation point to left bottom. So I cannot overwrite it with the "strech" option. How do you solve/bypass this?

dreamy kelp
#

EDIT: Nvm, I added code that sets the localscale after instantiation to 1,1,1 . For me, that does the job

twin salmon
#

Hello guys I'm looking for good tutorial for this Amazing UI Toolkit.
I didn't succed to make a pop up display with a bouncing animation.
And now I am looking for customizing radiobutton like an abilty bar where you can select only one ability.
Do you know where I can have these information ??

keen widget
#

@twin salmon Well you are looking for radio button group. Where you give option that it selects only one. Sadly tehre is not a lot of recourses, and toolkit documentation is pretty much main one 😄

keen widget
# 
    private void SelectTeleportTarget(ClickEvent evt) {
        // Only perform this action at the target, not in a parent
        if (evt.propagationPhase != PropagationPhase.AtTarget)
            return;

        // Assign a random new color
        var targetBox = evt.target as Button;
        TeleportList.IndexOf(targetBox.parent);
  Debug.Log("SelectTeleportTarget " + targetBox.parent.name + "and index of that element is " + TeleportList.IndexOf(targetBox.parent)); // correct name but incorrect index
        ScrollToSelected(targetBox.parent);
}

so what I am doing wrong?

I fill scroll view with templates that is:
VisualElement->ChildButton

And on button press I get the correct data of visual element and button, but I cannot get the correct index of that element in scrollview. I get index of -1, which means that object does not exist in TeleportList scroll view object.

keen widget
#

Or how Should I know which ScrollList element triggered the event?

twin salmon
keen widget
twin salmon
#

You can rewrite UI élément from scratch ?

keen widget
#

Yes, there are multiple ways of doing it. It just doing that from scratch takes time 😄

tepid knot
#

How can I set mousewheel scrolling speed of ListView? I tried changing verticalPageSize and --unity-metrics-single_line-height: 500px, but none of them seems to work in Unity 2021.2.11f1

distant pewter
cosmic bobcat
#

How do I do keyboard navigation in UI Toolkit? I want to be able to navigate through buttons and form elements with arrow keys and/or tab key.

copper solar
west sandal
#

the canvas has a raycaster?

thin coral
#

Yes, it's called a Graphics Raycaster

copper solar
#

How to register button click callbakc which would run on another script? Aka would be able to be seen on parent script?

#

Or I must use qurry and create those events on Parent script?

inland laurel
#

Maybe I'm overlooking it, but is there a way in the Unity editor to see the visualelements / buttons that are currently in the "DOM" (not sure if this is the correct term for this)?

For example, I'm adding a bunch of buttons to a particular VisualElement via a script at runtime, and it would be nice if I could check to see if they're all there. I looked at the Unity debug mode for the inspector, and nothing popped out at me ---

EDIT: In case anyone searches for this: I was overlooking it. It's in Window > UI Toolkit > Debugger. You can "Pick Element" and it works perfectly. Exactly what I needed.

west sandal
copper solar
#

really stupid question, how change property from CreateInspectorGUI()?

#

I mean not change UI values with values from script, but change parameters in script from UI. When UI is created is just by putting Binding Path, but when I create Ui from C# code, I am not sure how to do it. it must be super simple..

#

in property GUI it is just " CreatePropertyGUI(SerializedProperty property)" but in InspectorGUI i dont know how 😦

kindred basin
#

so like, swapping out objects with a ui inputsystem module just breaks input entirely, im assuming i need to have a single constantly active ui object and swap the ui document's root asset?

copper solar
#

I was following this tutorial. Everything works, but I am keep getting You are trying to create a MonoBehaviour using the 'new' keyword. This is not allowed. MonoBehaviours can only be added using AddComponent(). Alternatively, your script can inherit from ScriptableObject or no base class at all
Any ideas why? or should I ignore it?

# 
var newListEntry = m_ListEntryTemplate.Instantiate();

      // Instantiate a controller for the data
      var newListEntryLogic = new CharacterListEntryController();

      // Assign the controller script to the visual element
      newListEntry.userData = newListEntryLogic;

      // Initialize the controller script
      newListEntryLogic.SetVisualElement(newListEntry);

it comes from here

#

Only difference as I am not using ListView, but scroll view, so I dont have m_CharacterList.makeItem = () => call. But besides that everything is same

placid crag
#

You probably made CharacterListEntryController inherit from MonoBehaviour. Check the tutorial if they did the same.

copper solar
#

As it is convienient to have logic in smaller function which handles all UI changes, but when it comes to values changes, it is more convienent to handle it in bigger controler

summer moth
#

I'm showing a sprite that is using the image grayscale for alpha. However, the antialiasing appears to be against black rather than against the background. Any idea why?

unknown.png
plush patio
#

I'm creating a dropdown menu and I need the default option to be the third one, how can I do this without scripting?

mellow gyro
#

@summer moth how did you make the texture?

#

More than likely it's a premultiply issur

summer moth
#

Just in photoshop. Where would I mess with pre multiply stuff?

mellow gyro
#

ah, photoshop doesn't make it easy. Its best to fill further out from the alpha. I'll send an example

#

What does the image look like? if you don't mind posting

mellow gyro
#

@summer moth

pn_2022-02-25_13-29-31.png
#

Your source file is more than likely like B in the image

summer moth
#

Huh, that’s interesting, I thought I’d made sure that wouldn’t happen but it goes really make sense that would be it. Thanks!

sick inlet
#

Do I need to import something to get the tooltips for the ui builder to work correctly? I can hover over the controls in the ui builder and rather than getting an informative tooltip I instead get the name of the parent control

keen widget
#

is there a way to call RegisterCallback fro another class which odes not have game object, aka is mounted ad userdata on another UI object?

keen widget
#

Does w_MainMenuSubMenu.ToggleInClassList("submenu-style-hidden"); not trigger transitions?

copper solar
#

How to disable selected feature in ListView ?

tepid knot
#

How can I add runtime generated buttons to focus ring navigation?

keen widget
#

This is how it looks in UI builder.

unknown.png
#

and this is how it looks at game.

unknown.png
#

Resolution is the same. But it looks incorrect

#

any tips?

copper solar
#

Anyone know how to get Resolution of current visual element? as it sales depending on screen size, so I would like to get current one of specific visual element.

steel heron
#

This is definitely a UI rendering scaling and object placement issue. The scale is the same, but the second image represents an alignment change, it seems. There's less padding / spacing on the right side of the, 'Off', text. Honestly, to avoid this ever happening I might cheat and make the little bar around 50% wider so the text wasn't quite as close to the edges. But even that wouldn't be complete. I'd additionally split the text into two parts - one aligned to the left side and one to the right.

bronze heron
#

Do I have any control over the layering in UI Toolkit? I am using visual elements as containers
Here is my hierarchy:

Root Visual element
|
--Top Visual Element (container)
|
----Menu Button
|
|
--Middle Visual Element (container)
|
|
--Bottom Visual Element (container)

When the menu button is clicked, a dropdown appears that is located in the top visual element, but it expands down into the middle visual element. This works.
However, when i attempt to click a button on the drop down, it does not work. seemingly because it is located in the top visual element and the middle visual element is receive the click.

I'd like this dropdown menu to go to a higher layer so that it can receive mouse clicks before the middle visual element container.

copper solar
copper solar
#

versus Intended. The difference is small but I can see it just like previous posted On/Off slider.,

acoustic oyster
#

Hello there, is there a way to get pen pressure when using UIElements? I have a method that is executed on mouse move and upon checking the available properties within MouseMoveEvent class I couldn't see anything related to pen. Is it currently not possible to acquire such info, or am I looking in the wrong place? Also, I am using Unity 2021.2.1

winged oak
#

Hi, my button is not reacting on click, seen in the image, i used both methods to assign Click Event but when clicking ingame, the callback does not get fired

#

(of course i tried each method individually before, so RegisterCallback and the way assigning via += Operators, refering to line 38 and 39)

merry fog
#

ello does aynone know any good inventory tutorials

copper solar
# winged oak

You have your input system and event system on your UI element In Unity right?

novel socket
#

Hey there,
I have a Problem with UI Builder. I try to make an editor window which allows me to create custom hex grids. For that i made an editor window which has a custom control for displaying a grid. It works fine as long as I am working in the UI Builder, but as soon as I hit save i get the error: Element 'UnityEngine.UIElements.HexSelection' has no registered factory method.

In Builder:

hex_Builder.PNG
#

After save:

hex_save.PNG
copper solar
#

Any ideas how to implement Input with Japanese symbols on WebGL?

#

Or is it possible to make Input field work just like if it would be game object?

winged oak
keen widget
rain pecan
#

Hi, i´m currently trying to do a healthbar with the progress bar element and i encountered a problem. I can´t change the color of the progress bar and background, because i cant change the values in the inspector. Does anyone of you guys know how to do it?

unknown.png
winged oak
#

@rain pecan can you post the inspector view too please, i mean the place where you would want to change the color

rain pecan
#

@winged oak

unknown.png
winged oak
#

thanks, let me check

#

is there any code connected to this already? Maybe some enable/disable functionality? As i have not seen these items on the left beeing greyed out before, they look like "disabled"

#

i would probably go and manually check the uxml code of uidocument, see if you can find any hint there on why these are disabled

rain pecan
#

ok i´ll try that

rain pecan
winged oak
#

ok then check the uidocs xml, if not sure what to look for, paste it on pastebin and send me the link

rain pecan
#

i found the uss file but not the uidocs

winged oak
#

Should be looking like this and it .uxml file ending:

unknown.png
rain pecan
winged oak
#

@rain pecan
Try replacing the full content of you uidocument, with the one pasted here: https://pastebin.com/raw/fFFdqcpF
This is the same, but i have changed some character encoding. If that works now, then congrats, you found a bug in ui toolkit : )

#

i will go for a smoke, brb in 5 mins

rain pecan
#

unfortunately it doesn´t work, it just lets all the items disappear, but i just found a way to edit it. Thank you for your help!

winged oak
#

well it was worth a try. Did you manage to get the items enabled with your editings then?

rain pecan
#

no, but i can just change the style with a stylesheet( i tried it before but i used the wrong name, because there were two _ instead of one in the name)

winged oak
#

oh ok, well if anyone comes past here and knows how to enable them again, i would be interested in the solution too. Nice you found a workaround 👍

keen widget
# rain pecan <@!317773532840853504>

Hi there. You can fix this in two ways:

  1. create correct selector. In your case, you would need to name your progress bar name in any name or give it any custom class. then create new selector.
    #ProgressBarNameyouneedtoadd .elementyouwanttochange class
    This will let you to change that element class. Because otherwise you would change your Unity visual elements :DDDD
    This is how you find the names: Window -> UItoolkit -> debuger. press Pick element. Then press on element you want to inspect.
unknown.png
#

so what you need would be:
#ProgressBarNameyouneedtoadd .unity-progress-bar__background

#

with this elector you can change color of background

#

#ProgressBarNameyouneedtoadd .unity-progress-bar__progress is forthe loading part

#
  1. second way to do everything thourgh C# code.
#

get your ProgressBar element by querry, and then in code you can change colors of each element

rain pecan
#

Thanks!

still lantern
#

Do we know why FloatField and IntField are editor only...?

fiery mountain
#

anyone know how i could setup a custom UxmlAttributeDescription with a list of strings? When I try to it always shows an empty string field.

fiery mountain
#

If I mimic the enum version it doesn't work. I was trying to use some other methods to try and make it show but doesn't want to

#

even better would be an object field if that is even possible

rough scarab
still lantern
rough scarab
#

Because they didn't make a runtime version until then

still lantern
#

Also it turns out for no apparent reason you can't create a field that derives from the base like TextField does (or FloatField)

still lantern
rough scarab
#

To be clear in case you misinterpreted, yes

still lantern
#

Oh

#

Oh sick they are!

rough scarab
#

They also have vector fields, etc

still lantern
#

Oh and they made the constructor protected instead of internal

#

Woot!

#

Thank you very much

rough scarab
#

It's still very early days which is sad seeing as it has been ages

still lantern
#

Is it possible to delete a thread I may or may not have created on the forums by change...? lol

still lantern
rough scarab
#

Things are slightly clunky or poorly implemented

#

I had to make a hack manipulator so that the dragger would round correctly

#

Because otherwise if I rounded a field it wouldn't drag correctly. Mine uses the Delta from when you started dragging, theirs is a new Delta every frame