🧰┃ui-toolkit

[gusty estuary]

ahem

I mean

you use fixed height

you get fixed height

[trail oasis]

not all elements are fixed height

i have dynamic stuff i want to append

[gusty estuary]

but they all will have to calculate taking into account that one is fixed

[trail oasis]

sure but the only way to get my error box working to switch everything to have pixel height not % height

[gusty estuary]

Did you try absolute, bottom 0 solution?

[trail oasis]

no there will be more stuff below error box when i finish the layout

some buttons mostly

[gusty estuary]

you could use shared bottom container

for that

but one problem with absolute

is that it will not be taken into account

when you add sibling elements that are not absolute

[trail oasis]

ive only used absolute for overlaying text on a progress bar

seems to be the only legit use for it so far other than popups

[gusty estuary]

there are many other ways you can achieve bottom expandable container behaviour

for example you can have 2 containers at root of panel which occupy whole panel via grow

in ratio you want

and then you fill each accordingly

but if you go pixel all the way - say goodbye to other monitor sizes 😅

at least, they usually look garbo

[trail oasis]

doesnt the settings scaler fix the pixel issue

[gusty estuary]

only for text

and other supported styles

container sizes are keeping their pixel values

you can just play around in game view

to see how it scales

[bronze iron]

Is it possible to force a UI document or panel to render texture? Currently, the render texture is a frame behind

[gusty vapor]

@gusty estuary found a way to make sure padding follows parents rect

it's there all this time.. lmao

[gusty estuary]

?

[gusty vapor]

🥹

my layout won't be affected by padding garbage now 🥹

[gusty estuary]

I don't get it

that's for C# styling only

right?

[gusty vapor]

I think so

[gusty estuary]

not interested then

😅

[gusty vapor]

unless you find a way to access the Rect from uss/uxml

which I don't think that's possible as it is now

copyring parent's rect property to paddingRect works beautifully with % now

🥹

[teal belfry]

In code...how could I change button background image when someone hovers over button

[trail oasis]

you need to use psuedo class :hover

so in code you apply the hover class

for mouse over although you dont need to because hover auto detects mouse over for you

[trail oasis]

how would i query for the second foreground element here i cant rename them since they custom controls

[rough scarab]

The custom control should be distinguishing them with classes

If you are not in control of that, then you can iterate the hierarchy manually, its API is very similar to the Transform API. Or you can make some complex query, but eh

[trail oasis]

really hope they can come up with a cleaner way to link to game scripts because using strings is a pain if you then change names in the ui you got to go every where to fix broken links

[rough scarab]

⚠️ UI Toolkit is not UGUI, please see #📲┃ui-ux instead. ⚠️

🗃️ Documentation

Developer Guide
Comparison of UI Systems (+recommendations)

📚 Resources

Blogs, e-books, and videos

• UI Toolkit Technical Articles
• Create better Editor and game interfaces faster with UI Toolkit (Unite 2023)
• Introducing the Vector API
• User interface design and implementation
• UIToolkit at runtime
• Extending the Editor with UIElements

Samples

• Dragon Crashers
• Editor Examples

Guides

• Styling elements

🗺️ Roadmap

UI roadmap

Your custom control can also expose whatever references it wants, as it constructed its children it could just contain public references to them, so you would just query for the ProgressBar

[trail oasis]

ohh thats a good idea

you smart

that would make it more robust

[gusty vapor]

This might be dumb, but I just found out what HandleEvent means in VisualElement and how to use it

@gusty estuary may not know it just yet

I can throw away most of GeometryChangedEvent used in my projects now 😅

[trail oasis]

enlighten us

[gusty vapor]

You can capture all EventBase<T> with it

if they're already implemented by default, just listen to that

no need to register bunch of callbacks

you can as well send events via SendEvents, which I also did not know before 😅

quite handy

overall it's very handy to know what events available in a control programmatically

for sending an event, you can do this

using (var foo = PointerDownEven.GetPooled(someEvent))
{
    x.target = something;
    something.SendEvent(foo);
}

I see what they did, now

[trail oasis]

how do you change all the child element's from the same transition is that possible

i want the child elements to all change their font colour

[trail oasis]

any one know what causes this

[gusty estuary]

child selector

[trail oasis]

whats the syntax in the builder for that

confused how to set it up

[gusty estuary]

Look up manual

I don't really remember

Also syntax is same betweem ui builder and uss file text

[trail oasis]

this isn't very clear to me

not sure i understand what this even means

[trail oasis]

ok figured it out

[dark blade]

looks simple, yet so beautiful, is there any easy way to create those lists "holder", or its actually use ui toolkit vector api?

[gusty vapor]

@gusty estuary do you know what this throw means when removing child of GraphElement VisualElement already contained

1st time ever I got this kind of throw

basically it's impossible to remove it from hierarchy

[blazing tinsel]

It's the child combinator from CSS https://developer.mozilla.org/en-US/docs/Web/CSS/Child_combinator

[gusty estuary]

why not paste full error?

[trail oasis]

Ah so direct means first child only

[blazing tinsel]

First level child, yes. So ".button > .button" applies to all .buttons that are direct children of another button (nested 1 level deep). ".button .button" applies to all buttons that are children of any level of other buttons (nested 1+ levels deep).

For first child only CSS has this https://developer.mozilla.org/en-US/docs/Web/CSS/:first-child Not sure if USS supports it

[trail oasis]

I see, I have been making separate classes on a new line, didn't realise you could chain it like that

Makes the uss hierarchy in the builder cleaner

[gusty vapor]

basically just that.. it's useless kind of error

the rest unrelated garbage

[gusty estuary]

maybe you are trying to add element that is already a child?

[gusty vapor]

it was removal

100% sure

I mean can we even restrict deletion/removal of a child? if so, that's cool too

[gusty estuary]

no

you can only add special container

which will be actual VE to which you add

similiar to SrollView

[trail oasis]

how do i debug to check if the class got added to my ui with the script i wrote

for some reason its not transitioning so need to check the class was actually applied

oh found it

hmm strange it is loaded

🤔

im applying this to my element and have confirmed it via the debugger:

.load {
    transition-property: opacity;
    transition-duration: 0.5s;
    transition-timing-function: ease-in-out;
    opacity: 1;
}

.unload {
    opacity: 0;
    transition-duration: 0.25s;
    transition-property: opacity;
    transition-timing-function: ease-in-out;
}
``` but im not seeing a transition occur when i apply load

everything is unset so no inline overrides occuring

i do know the transition doesn't occur because i registered a callback and the callback on end didn't run

so im kinda lost what could be the reason

[gusty estuary]

did you define transition property?

oh yes

sorry

me blind kekw

[trail oasis]

i found it . in awake i was setting opacity to 0 and display to none as the init but this counts as an inline so was overriding the transitions

i fixed it now

[gusty estuary]

yeah, it's best to avoid inline altogether

[trail oasis]

yeh i thought if i applied the unload class in awake it would transition out which would look weird on first load

[trail oasis]

OnComplete(TransitionEndEvent evt)

this gets called 18 times from a transition that is surely a bug?

unless all the transitions in child elements also call it ?

which would be absurd if true

ah god damn it - it does include all the child elements

thats so annoying

[small wigeon]

hmm, are there any attributes that are more efficient to set directly rather than styles?

like if I set display: none will it early out

[gusty vapor]

wdym?

so you want to call it like this vis.DisplayNone();

if so, you can just make your own extension

[small wigeon]

I mean as opposed to using a class

[trail oasis]

if you have two classes defined in two templates will they conflict ?

eg if you have

.test

in two different templates that do different styles and import both templates to a document will it still link correctly

or conflict

[gusty estuary]

Efficient for what?

[gusty estuary]

If they are local to uxml - no

but all tenplates inside will get uss

So if you have one root with uss, that uss will be inherited by all uxml templates inside root, and all uxml templates inside recursively

[trail oasis]

so the root overrides the children but two siblings (such as two templates in the same hierarchy level) wont conflict with each other

[gusty estuary]

I don't get your example

where is uss in that case

[small wigeon]

well there's no need to resolve styles just to disable the element if it's just going to be disabled

[gusty estuary]

Each child it's own?

[gusty estuary]

Not really. Disabling is style, because it modifies layout.

[trail oasis]

root .test ¬
myTemplate (which inside has a .test some where of its own)

root overrides?

but would this cause issues:

root ¬
template1 (with it's own .test in its own uss)
template2 (with it's own .test in its own uss)

[gusty estuary]

🥴

Sir, just: uss inherited only by children

[trail oasis]

what

[gusty estuary]

Not by siblings

[trail oasis]

im not trying to inherit

im asking if they will conflict

if by chance two templates had the same class name

would they conflict

[gusty estuary]

there is no such thing as conflict

If you define two same selectors

[trail oasis]

so if two templates both have a .test but different styles in them

theres no conflict

[gusty estuary]

One below will take priority

[trail oasis]

they are only defined in the template though

not in the main visual tree

[gusty estuary]

If uxml doesn't have uss and it's parent neither - then it won't get it

[trail oasis]

if these two both had say .test-label with their own style

they wont know about each other right?

even if they had identical class names

because if they conflict it will be a real pain making sure every class is not overriding another template some where

[gusty estuary]

if no uss was added higher them, then no

[trail oasis]

ok so only parents can overrule

thats good to know

thank god for that otherwise it would be a nightmare

[gusty estuary]

no

uss can be inherited from parent

but the lower it is - the higher priority

[trail oasis]

Ah

That would make sense

[gusty estuary]

I swear all this is part of styling manual I kept saying you to read 👴

[trail oasis]

Their manual is a word salad

Isn't that great to follow nor is there demo scene

[gusty estuary]

sure, but all I know is from it

[trail oasis]

Ive not done css stuff so the styling section was hard to really understand well

[gusty estuary]

I never done css either

UITK is literally the first ui framework in my life

kekw

[trail oasis]

Lol I see

I'm just learning by experimenting

[gusty estuary]

(by asking questions here)

[silk moth]

Hi. I have a problem. When you make changes to a class, they are not applied to objects of the same class. I don't understand what the problem is, can someone help?

[trail oasis]

if you have errors it might be compiling

for it to apply

do you have any inlines applied to it

[trail oasis]

only when something doesn't make sense

plus that is the point of this server 😉

[rough scarab]

You have inline styles overriding anything the stylesheet is doing

[silk moth]

Okay, how do I cancel them?

[rough scarab]

right click, it's one of the options

[silk moth]

thank you, it remains to understand at what stage I made a mistake

[gusty vapor]

Dumb way to undo/redo in uitk without binding property specifically for listview
Undo.undoRedoPerformed += ()=>{listv.Rebuild();};

I really wish they could make binding property more flexible for custom editors

right now, it's sorta a hassle to work with

by that I mean, less flexible compared to manually registering callbacks

[gusty vapor]

display flex and none are special case. When you change the state from none to flex it will regenerate/reallocate all mesh data

in short, what you're asking is useless

I wonder tho, what visibility do under the hood 🤔 and based on this post, visibility kinda sucks big time https://forum.unity.com/threads/testing-performance-between-ui-toolkit-and-ugui.1060793/

[trail oasis]

unity did not make it easy to understand tbh but just rule of thumb never touch inline styles always use classes

[trail oasis]

wait is that true 😐

[gusty vapor]

yes

[trail oasis]

i been changing the display after a fade out

assuming thats how you stop pointer events

is there a less expensive way

[gusty vapor]

yes

        public override void HandleEvent(EventBase evt)
        {
            if (evt is PointerClickEvent click)
            {
                click.StopImmediatePropagation();
            }
        }

to stop your pointer events before being submitted

[trail oasis]

i see, so the best way to hide ui is simply set opacity to 0 and not bother with touching the display

[gusty vapor]

depends, opacity is not the same as DisplayStyle

[trail oasis]

i know i just have an open/close animation and ive been setting display to flex/none respectively once the opacity transition completes

but if it recalculates everything that seems expensive and kinda annoying

[gusty vapor]

@gusty estuary I was handed over a running project for internal tooling due to the dude who made it resigned. it's a massive project consists of 2200+ VisualElements.
What's fun is that, the dude didn't use binding properties, instead he hard-wire everything via register callbacks 😂

Total of used callbacks are more than 1200+ callbacks via registerCallback

I thought I've seen everything in gamedev, but this is on a whole 'nother level 😄

I see why he resigned so suddenly now 😂

duplicate APIs all over the place 🤣

it has massive Undo/Redo issue due to not using binding properties, basically it's barely functioning for undo/redo

...

managed to fix it...

[gusty estuary]

[gusty vapor]

life is beautiful 🥹 .. so I can carry on with my porting stuffs

[small wigeon]

editor binding?

[pliant mortar]

Hello, I would like to know when the UIElements are available for modifications (for instance set the text of a Label). From the Start method it's ok, but from the Awake/OnNetworkSpawn methods it's not.

I need to set the text from the OnNetworkSpawn method and it doesn't work... Start method is too late

[pastel egret]

Has anyone had trouble using UI Toolkit transitions? for some reason my transitions are working in the UI Builder preview window but not in game.

Im using Unity 2021.3.

I have a USS class with the transition and add it to the UI element in runtime
container.AddToClassList("slideIn");

Im also changing the visualTreeAsset in the same method I add the class to the container

uiDoc = visualTreeAsset = load(pathToTheUXML)

container.AddToClassList("slideIn");

Im pulling my balding head hairs on this. From what I read it might have been the unity version because of the old ui event system, but on my version it shouldn't be a problem.

Anyone have any ideas?
Would be greatly appreciated

[cold urchin]

Is there anyway to remove any default unity styles from the ui? like i want the components with absolutly no default styles barebone

[gusty estuary]

just don't add default unity theme to yours

but I believe it's not going to work anyway

[cold urchin]

yea i removed the theme and yes it's much better now but there are still some unity styles with some random "margin: 1px" all over the place

[gusty estuary]

which element is it?

[cold urchin]

basically all of them but here is the text field

[gusty estuary]

🤷‍♂️

unity specifically mentions it's not supported

[cold urchin]

whats not supported?

[gusty estuary]

not inheriting from default theme

[cold urchin]

I understand that maybe ".unity-text-field" is crucial but the ones that are effecting it are not the main ones

[gusty estuary]

check via debugger

[cold urchin]

so e.x here only the .unity-base-field is effecting it not the other ones but even that is annoying i see no reason that not having random margins and paddins everywhere is not possible

[gusty estuary]

to be sure

it's actually applied

btw

[cold urchin]

actually looking at it by removing the default theme there is indeed no more default random styles... it shows in the editor that the "unity-base-field" has margin but the debugger shows absolutlly nothing so... i guess it works?

[gusty estuary]

🤷‍♂️

[merry mountain]

Im making a custom visual element and i want a way to check if im in preview mode or not

pretty much trying to hack ListView to display a visual element while working inside ui builder and then trying to clean up if in preview - runtime or something like that

<_< why is working with list view such a pain from a design perspective?

[gusty vapor]

what hack in this context?

I mean, you're already making a custom, what would you want to hack it for?

[merry mountain]

im just making fun ^^

[merry mountain]

The fact im still using the listview but as a child container

unless i somehow recreate the entire listview functionality - inherit from it and expand

several research says the suggested workflow for listview expansion is to just make it a child container and work 'around' it

albeit i am still confused ngl

[gusty vapor]

easy way, yeah just derives your custom class from listview
btw gtg

[merry mountain]

i doubt its that simple

okay bye bye

i mean i can try, but no way its that simple

cause the reason im doubting, is the fact in a scroll view, you can drop an item and add it in the hierarchy

but if you try to do that in the listview you are blocked / it doesnt let you do it

[gusty vapor]

listview wasn't made for that... the restriction Listview has mostly related to virtualization/pooling, like in your case

use scrollview instead

tho you still can achieve dragNdrop in Listview with some tinkering

just assign the drop area in your binding element template, and do your logic in there

[teal belfry]

Is there a way to do sprite sheet stuff in UI toolkit?

or do I have to change img by code every so often

[trail oasis]

any one know why it says this when i try to add a template

[rough scarab]

presumably you are nesting something inside of itself

[trail oasis]

im just adding it to my main menu panel

what should i look for to find conflicts

<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" editor-extension-mode="False">
    <Style src="project://database/Assets/Ui/Style%20Sheets/itembutton.uss?fileID=7433441132597879392&amp;guid=d0dc754b336a4af458e641beaf4fc649&amp;type=3#itembutton" />
    <ui:VisualElement name="item-container">
        <ui:VisualElement name="item-slot" />
    </ui:VisualElement>
</ui:UXML>

this is what im trying to add as a template

there is a weird bug where the ui builder shows the wrong uss 🤔

[trail oasis]

restarted unity and it fixed it

i noticed the uss file in the editor was not the same as the actual file seems there was some bug there

i have recompile/scene reload things unticked in preferences i wonder if thats why

[hushed meteor]

Is there anyone know why I get error: Getting control 0's position in a group with only 0 controls when doing repaint

[teal belfry]

Bump questiom

[gusty vapor]

wdym by sprite sheet?

[gusty vapor]

it's a pretty ancient issue in IMGui.. mostly bcos you're changing the content of your IMGui during repainting

note that most IMgui events will be executed multiple times in the same frame

if you're using IMGuiContainer, you should adapt with the workflow of removing/replacing your container
also, don't use MarkDirtyRepaint

scheduling is your bae here

they also soon publish the internal apiss for default inspector, so we won't need IMGuiContainer anymore :thum🥹

(by soon I mean, years 😂 )

[hushed meteor]

It is possible to exactly the same look inspector gui in ui element? var editor = Editor.CreateEditor(selectedObject); IMGUIContainer IMGUIContainer = new IMGUIContainer(() => { editor.OnInspectorGUI(); }); root.Add(IMGUIContainer);

This code work in some cases. However, some objects like texture and material will not work.

[gusty vapor]

you can do everything that IMGui can do via IMGuiContainer, you just need to know what layout/api you should hook it up to the container

[gusty vapor]

btw why you're hooking OnInspectorGui tho?

you'll get nothing from that

[hushed meteor]

I can get so, and component by using OnInspectorGUI

[gusty vapor]

for material tab, you'd want to look the .header layout, the convention is something like that

I've a project where I showed the default material inspector in imguicontainer, I'll see tomorrow if I can still find it

and post it here

[hushed meteor]

Thanks.

[mellow silo]

How should I go about assigning a response to a button click? I've been using the standard RegisterCallback so far, but I need the response to change every time a certain method is ran, instead of adding a new response on top of the old one.

[trail oasis]

the said ran method will have to call a method that removes and adds a new call back

[mellow silo]

Ok. Thanks for the help!

[trail oasis]

could be more simpler to just hide the button and show a different button

that might make the code simpler

[mellow silo]

Wouldn't that be bad for performance, though? Especially when a good chunk of the time the new call back is to just do nothing (when the thing the button does is on a cooldown timer, for example.).

[trail oasis]

change their opacity then look through what elements were clicked and find the button you are looking for

you can get the list of all elements under the mouse

you can just check the opacity to know which one was clicked if they overlap each other

to me that makes it slightly easier than swapping in and out event buttons

and i presume the next button might have a different text label to signify what it does so would be a different element or at least have its text changed

changing opacity wont hurt perf as i believe it wont force a redraw of the ui heirarchy like display does

[mellow silo]

I ended up switching the event to just be .clicked, since the only reason that I wasn't using it before was because I couldn't figure out how to use it. Does that change the suggested course of action?

[trail oasis]

a third option just count the number of clicks in your event function

and then use a switch statement to call another function

so you dont have to ever change the actual events on the button

[mellow silo]

The button's callback has several different states that are determined by RNG, so click count wouldn't work.

[trail oasis]

tbh im not 100% sure on usage either

i am certain unity hasn't finalised their event system

and will likely change at some point to an even easier system

they have clicked and registering events

not sure why we have both

i presume clicked is mouse specific but registering for events will allow you to support other device inputs

[mellow silo]

I thought that clicked was specifically for buttons, and that registering events was for clicking on things that aren't buttons. Then again, I'm also not sure on that.

[trail oasis]

yeh but if you use a controller what does clicked really mean

i presume events lets you register to the input system which gives more control

[mellow silo]

I'm still having a few problems. Specifically, how can I have the button's method take a parameter while still being able to remove the method from the button?

[gusty vapor]

wdym remove the method?

you want your button won't responding to clicks?

[mellow silo]

In certain contexts (such as something being on a cooldown timer), yes.

[gusty vapor]

the use Clickable instead of clicked

Clickable has delay function

https://docs.unity3d.com/Packages/com.unity.ui@1.0/api/UnityEngine.UIElements.Clickable.html

[mellow silo]

I need to be able to remove the method from the button. I have other conditions where I would need to be able to remove the method (my game has a status effect where you can't use certain attacks, for example.)

[gusty vapor]

still not quite sure what you mean by removing the method

still

use Clickable instead of clicked

you can stokp the propagation with x.StopImmediatePropagation();

[mellow silo]

The button gets assigned a callback at the beginning of a battle. If a character gets the aforementioned status effect, I need to be able to make the button that starts the affected attacks not do anything. The game is a turn based RPG, so timer-related things won't work.

[gusty vapor]

is this the Button we're talking about or it's actually just regular visualElement with registered callback on it?

[mellow silo]

This is Button, yes.

[gusty vapor]

yeh.. use clickable instead of clicked

[trail oasis]

this doesnt really do a good job in explaining how to use it

"heres a bunch of functions, good luck"

basically

[gusty vapor]

it's not scripting api like you'd find in docs..

it specifically for developers.. a different kind of docs

[trail oasis]

arent we all developers 🤔

but yeh they need to add an example in regular docs

i hate this seperation of docs they have going on

[gusty vapor]

it's quite common if you're in working/professional environment, some would consider it as internal docs

tbh, they're quite clear and easy to understand just by looking at the parameters and the return values

plus you can see the inheritance tree, which is quite important

[wispy sage]

Hello,

I hope you all do well !
I'm not a huge pro with Discord, so I guess this is chanel to discuss UITK topics, right ?

[wispy sage]

Hello,

Are you sure your class is applied ?
I see 2 cases where that could fail

1/ Either your element already has the "final" property of your class (E.g : Your class tells your element to go to opacity 1, in 1 seconds. But your element already has the opacity of 1, so it won't move)
2/ Either, you're adding it too fast, and UITK doesn't have time to properly register it. You can space that for a frame to see how it goes.

[pastel egret]

Thank you for the response! I had added a background color just to see if the style does apply and it does, however the transition does not.

1/ Unfortunately the element has an opacity of 0 to begin with so it isn’t this.

2/ I haven’t tried this. From some videos I’ve seen online it works fine without spacing it. I hope its this, I’ll update once I try it out.

Thank you again for the input/advice!
I appreciate it

[small wigeon]

Yes, but you don't need to say hello every time you say something 😛

[wispy sage]

Can you share your USS and à screen shot of your element ?
Maybe you force the style with the inline. So the class cannot apply !

[small wigeon]

Should I put ui stuff in a "Editor Default Resources" in my package?

I see the entities ui stuff uses it

[gusty vapor]

Woaaaa we can do data binding in 2023 on runtime 🥳

https://forum.unity.com/threads/data-binding-to-gameobject-property.1279856/

[small wigeon]

Will be interesting to see if they revamp SerializedObject or implement a new system

[gusty estuary]

2023.2

My framework becomes obsolete

Allthough

is localization a thing yet

For uitk

[young spade]

Hi, so I have this UI which I made using the toolkit. It looks like this in the editor

I've set the document to match the game view

But when I attach it to an empty object with a UI Document component & panel settings

It ends up looking like this

I used px a-lot when positioning & sizing during the creation of the UI; but I didn't expect it to be a problem because the size of the entire canvas in the editor is the same as the gameview

[gusty vapor]

that is somewhat, true 😆

[gusty vapor]

as in?

[gusty vapor]

why? it's fine as it is

[small wigeon]

It's editor only, and only works for unity.object

Though I suppose using scriptable objects for binding isn't the end of the world

[gusty estuary]

As in localization

Languages

[gusty vapor]

I don't think so, but I can imagine that they'd somehow make work with their localization package

speaking of localizaitonn package.. I've never used that even once inn my life 🥹

[gusty estuary]

It's really nice

I guess one way to localize via binding

Is to bind to string field

Which is localized

Allthough

That is something I already do kekw

Meanwhile label isn't even Bindable afaik

[gusty vapor]

there's a trick to make it work onn runtime via Create.Delegate + reflection but its not worth an effort

due to .. well.. reflection

in Unity reflections won't be garbage collected

[gusty estuary]

What? How?

[gusty vapor]

we've been doing this for the longest time at my workplace

its for debugging purposes only

[gusty estuary]

How?

[gusty vapor]

well, I should take a peek at the code 1st 😄

using dispatching ttrick it can

and you can't cache the delegate, which is unfortunate

[gusty estuary]

I need code

Your words make no sense

[gusty vapor]

that what I thought too when 1st saw it 😄 ... I'll put it up here if it's not nda'd.. if it is, then ,, well

lots of magicians at my workplace 😅

Also I saw similar impl for Unity debugger/profiler iirc

[gusty estuary]

I need impl

[wispy sage]

What are the value of your PanelSettings & the value of your Editor size window ?

[gusty vapor]

easy thing to do without panelSettings myWidthInPixels * currentAspectRatio

public static float ScreenRatio(float value)
{
 return ((float)Screen.currentResolution.height / (float)Screen.currentResolution.width) * value;
}

if you're making a library/framework for public to consume, if it's personal project just use panelsettings yeah

or custom editors

[hushed meteor]

Is there anyone know how to customize the texture importer inspector?

[wispy sage]

What do you mean ? :).

[hushed meteor]

This one

[gusty vapor]

create your own custom inspector for it

[hushed meteor]

How to do that?

[gusty vapor]

https://docs.unity3d.com/Manual/UIE-HowTo-CreateCustomInspector.html

and read the docs regarding asset importer specifically

and implement all needed apis in your custom inspector

[hushed meteor]

But I can't get the default inspector. I am not going to completely recreate the whole inspector.

[small wigeon]

what are you trying to do?

[teal belfry]

sprite sheet as in like there are 10 "frames" that happen for an animation

like a gold chest opening has ex) 3 frames that the image switches from closed, to kinda open to open chest

[urban totem]

Hey does anyone know the details of when exactly the GeometryChangedEvent is dispatched with respect to script callbacks

How do you know when all the layout calculations are done an element so you know if you need to wait for geo change or not?

[gusty estuary]

this event is it

[urban totem]

This doesn't feel right

this.geoReady = !float.IsNaN(this.groupContainer.resolvedStyle.width);
if (!this.geoReady)
{
    this.groupContainer.RegisterCallback<GeometryChangedEvent>(GeometryChange);
}

[gusty estuary]

?

I have no idea what you are doing

[urban totem]

I have a UIDoc that is loading on scene startup. I have another gameobject loading on scene startup that needs to know some sizing information of elements in that visualtreeasset that's getting loaded

On Awake(), sometimes the resolved style info is available, sometimes it's not

Which implies layout stuff is happening asynchronously, so the question is how do you know if you even need to wait for a GeoChange event

[gusty estuary]

you are not meant to access other game objects or components in awake

only get reference

[urban totem]

Ah okay, are all the layout stuff guaranteed to be done by Start() then?

[gusty estuary]

just do stuff in geochange event?

[gusty estuary]

Layout will be calculated only when VisualElement is inside UIDoc

[urban totem]

Well the concern is missing the first GeoChange event depending on when you subscribe for it

Because sometimes the layout appears to be done by the time Awake is called. If you subscribe on Start(), is there a chance you won't get that first GeoChange event?

Basically, this gameobject needs sizing information before it can transition into it's 'active' state. I can't miss the earliest time at which the style info is available

[gusty estuary]

this all sounds like XY problem

[urban totem]

I really just need to know when the layout is calculated on an element

[gusty estuary]

on event callback

[urban totem]

and what if it's already calculated by the time I subscribe for the event?

[gusty estuary]

then you won't get it

[urban totem]

So on Start(), how the heck do I know that?

(if it's been caculated or not)

[gusty estuary]

why don't you just centralize instantiation

so you don't have to sync between game objects

[urban totem]

All these uielements are being instantiated on scene load? Isn't that centralized already?

[gusty estuary]

you decide when to instantiate

VisualTreeAsset.Instantiate

[gusty estuary]

in that case UIDoc instantiates it

in awake I think?

[urban totem]

Ah ok

So; if I put all my UIControllers in execution order before UIDocument

And subscribe on Awake() I'm good to go

I see what you're saying about manually instantiating the visual tree asset

[gusty estuary]

I don't think so

I think you'll be fine reading in Start

and you don't need script order for that

[urban totem]

I mean, yeah becuase I need to subsribe on at least the rootVisualElement which wouldn't be available yet

ok

[gusty estuary]

if you only need to read resolved value once

just do so in Start

[urban totem]

Yeah, for now that's the issue

I feel confident that if I change an element, I can subscribe on that same frame

I assume layout events are deferred to either end of frame or the start of the next?

[gusty estuary]

nah, each has it's own specifics

[urban totem]

ugh

okay, the working theory is this:

So long as I subscribe

this.groupContainer.RegisterCallback<GeometryChangedEvent>(GeometryChange);

in Awake(), I should get I should get the initial OnGeometryChangedEvent from a visualtreeasset instantiated on that same frame's Awake().

OR

I can wait for Start() and the layout for the visualtreeasset instantiated on scene load will be done. ResolvedStyles will all be valid.

... actually I have some more testing to do, because I've been trying to access resolved styles on Start()

Yeah no, that's busted now. First run:

        private void Start()
        {
            Debug.Log(Q<Label>("NotificationGroupContainer").resolvedStyle.width);

NaN

Yeah, so on about 1 / 5 or so runs the resolved style width is NaN on Start()

[urban totem]

I guess until it doesn't work I'll always subscribe on Awake()

[gusty vapor]

just necroing and not followinng the conversation, there's ResolvedStyle event... check if it's runtime event or not

[hexed spindle]

is there a visual element to show a sprite? i see ones for text and numbers and sliders. but i'm not seeing any for showing a sprite. like for say an inventory item.

[gusty estuary]

backgroundImage style supports sprites

[hexed spindle]

how do i bind the background style to a property?

[gusty estuary]

no such support built in

https://github.com/bustedbunny/com.bustedbunny.mvvmtoolkit

My framework supports that

[hexed spindle]

how do they have like three types of slider but no way to show dynamic images?

[urban totem]

Are you talking about CustomStyleResolvedEvent ?

[urban totem]

e.g.

.redline-img {
    position:absolute; 
    width:1920px; 
    height:1080px; 
    background-image: url('project://database/Assets/UI/Redlines/Redlines 1.png');
}

[urban totem]

@hexed spindle sorry I just noticed you were looking for dynamic images

[hexed spindle]

i just wanted to create a custom editor for an item definition. i had the item name, description, density, and a sprite icon selector working. was wanting to get it to also show a preview of the item icon. but this is too much of a headache to figure out. so i'm just going to give up. if it's going to be this much of a headache to do something that i was able to figure out with the previous custom inspector stuff.... i just don't want to work on this project anymore.

[urban totem]

Were you trying to do this in the unity editor?

[young spade]

Default

the game view is 1200 x 900

the editor window matches the game view

panel settings are all default

I think the problem is; when developing the UI

I was using the editor theme

Not the default one

Which is kind of stupid

Idk why Unity doesn't just select the runtime one automaticallyu

Now I gotta fix my entire UI

[ornate cliff]

@young spade Don't use ableist slurs, please.

[young spade]

My apologies

I've edited the message to something less vulgar

[gusty vapor]

nothing ootb, just make one yourself

for(int i = 0; i < sprites.Length; i++)
{
  myImageElement.sprite = sprites[i];
  await Task.Delay(TimeSpan.FromSeconds(0.2), cts.Token);
}

if you want frame-based change it to coroutine or Awaitable api in 2023

[gusty vapor]

just curious, why you check nan before your geochanged evnt tho?

by the time geochanged triggered it's already resolved

[urban totem]

because there's no way to know on Awake() if the style has been resolved yet or not

and if it's already resolved, you wont' get a GeoChanged event

[gusty vapor]

see the screenshot above

after layout calculations... it's already resolved

[gusty vapor]

try force refresh the layout via SendEvent

        public static void TryForceRefresh(VisualElement container)
        {
            container.schedule.Execute(() =>
            {
                var fakeOldRect = Rect.zero;
                var fakeNewRect = container.layout;

                using var evt = GeometryChangedEvent.GetPooled(fakeOldRect, fakeNewRect);
                evt.target = container;
                container.SendEvent(evt);
            });
        }

it will retrigger the geo change again

put it after your Awake or whatever

most of the time, you'd not need it, also not quite sure the behavior on runtime, you should test it on your end

nah, just sendevent, shouuld be fine

[woven blade]

Does anyone here want to help out with prototyping some complex UI screens using UI toolkit? (paid gig, dm me)

[urban totem]

Interesting, does this actually cause the layout to be calculated if it hasn’t been done yet?

[gusty vapor]

that is impossible scenario

[urban totem]

Yeah so consider writing a small program that just logs the resolved width of an element once at the earliest time it’s available

On awake it’s either resolved or not. If it is resolved, fine just log it. No geo event necessary

If it’s not resolved, triggering a geo event will cause NaN to be logged

The reason this matters is because I have some element layout work done from script that depends on the size of elements loaded from uxml styling. This layout needs to be done before the first frame is displayed on screen to avoid stuff popping into place

[gusty estuary]

what if your resolution changes during game?

[urban totem]

I’m using resolution scaling

[gusty estuary]

resolved is absolute value

[urban totem]

I haven’t tackled aspect ratio changes yet

[gusty estuary]

not normalized in any way

[urban totem]

It’s resolved to a 1080p reference

That scaled up to uhd and 4k behind the scenes

I only ever work in 1080 coordinates

[gusty estuary]

I'm just saying that resolvedStyle will return you pixel size

[urban totem]

I don’t think that’s right

[gusty estuary]

?

it's float

and if you need width or heigh it will be in pixels

[urban totem]

I’ll show you when I get to my desk

Float shouldn’t be relevant you can style elements on floats from uxml and uss

[gusty estuary]

you say that you want to read resolvedStyle.
Then you'll get absolute pixel size of element

during authoring stage you can define %

pixels won't scale though for layout sizes/offsets

only %

[urban totem]

        protected override void Awake()
        {
            this.geoReady = !float.IsNaN(this.groupContainer.resolvedStyle.width);
            if (!this.geoReady)
            {        
                this.groupContainer.RegisterCallback<GeometryChangedEvent>(GeometryChange);
            }
            else
            {
                Debug.Log("Geo ready: " + Q<VisualElement>("RedLine").resolvedStyle.width + " x " + Q<VisualElement>("RedLine").resolvedStyle.height);
            }

<ui:VisualElement picking-mode="Ignore" name="RedLine" class="redline-img" />

.redline-img {
    position:absolute; 
    width:1920px; 
    height:1080px; 
    background-image: url('project://database/Assets/UI/Redlines/Redlines 1.png');
}

[gusty estuary]

scaling only works on some styles like font size

if you define your layout with pixels

they will stay the same

[urban totem]

What specifically do you mean by this? Can you give an example?

[gusty estuary]

if you define width: 100px in your uxml

it will stay 100px no matter what resolution you have

[urban totem]

The image I shared just showed that isn't true

Maybe it's hard to see the redline

[gusty estuary]

try 1280x1024 resolution

[urban totem]

I added

    background-color: rgb(255, 0, 0);
    opacity: 0.5;

to the 1920x1080 width/height styled image

All these screenshots are freeaspect, so nothing is at a standard aspect ratio

[merry mountain]

im having slight troubles understanding how to make a custom MakeItem delegate in a custom editor inspector that uses a serialized property, i dont understand since for almost every example they depend on having the base list reference, but serialized properties dont work like that

can someone help me understand with a simple example?

a similar example would be this: https://docs.unity3d.com/Manual/UIE-create-list-view-complex.html

but instead of having the list directly i have the serialized property

from what i derive from documentation the preferred workflow to avoid potential data loss is to work with serialized properties thats why im also more confused i guess

[wispy sage]

Hello.

I'm curious to know did someone tried to run a spritesheet with a VisualElement, directly in UIBuilder ? I would like to try that and see if I can have animation directly there.

[dark blade]

if you know doozy ui, he did using sprite sheet in his visual element for each of editor icons, but honestly i have not idea how that goes, did try to search deeply on its github but to complex for me to understand, but at least for your questions it is possible

[gusty vapor]

sprite swapping for frame-by-frame animation is not that hard, I posted it yesterday here too

[wispy sage]

Hard no ! I was curious to see some feedback.
Thanks !

[small wigeon]

does uitk use text mesh pro internally or something else?

[gusty estuary]

no, they use TextCore

and someone mentioned so does TMP

[small wigeon]

that's some internal API?

[gusty estuary]

not sure if it's internal

but there's mirror on github

[small wigeon]

I assume I'd need to keep TMP around if I want to do any text in the world though

[gusty vapor]

both are using TextCore

not quite sure if they're the same impl

[gusty estuary]

yep

[gusty vapor]

I'm just hoping that they can add support for per/ mesh transparency in uitk's textcore, like they did in tmp

[small wigeon]

there's some public bits in TextCore, but the juicy stuff is internal

[pastel egret]

I never got back to you for this.
Thank you again, your second suggestion worked.💜

[wispy sage]

You're welcome ! Happy to help !

[merry mountain]

After finally working and understanding listview bit more im facing now a new problem

for some reason my ListView always adds a phantom - empty element no matter if the referenced serialized property is empty or not

that element always throws errors since the index doesnt exist, and i followed unity's guide on complex list views to no avail

https://docs.unity3d.com/Manual/UIE-create-list-view-complex.html (referencing this one)

Albeit for my use case im using it in a custom inspector under ```cs
CreateInspectorGUI()

[gusty vapor]

they're not phantom they're what we call virtualization/pooled objects

it will reuse visualElements to be displayed

you'd need to use unbindItem to free up events related to those pooled objects (if any)

[merry mountain]

they are phantom when they get added even when the serialized property list that is bound is empty

reusing should disable or hide the element

not display it no matter what

[gusty vapor]

show youur listview code

[merry mountain]

one moment please

        void SetupDriversList()
        {
            CustomList = root.Q<ListView>("Drivers-List");
            CustomList.Clear();
            CustomList.makeItem = () =>
            {
                VisualElement element = new();
                listElementUXML.CloneTree(element);
                return element;
            };
            CustomList.bindItem = (e, i) =>
            {
                e.Q<TextField>("Name-Field").isDelayed = true;
                e.Q<TextField>("Name-Field").BindProperty(DriversProperty.GetArrayElementAtIndex(i));
                Toggle safetyToggle = e.Q<Toggle>("Safety-Toggle");
                safetyToggle.value = true;
                Button deleteButton = e.Q<Button>("Delete-Button");
                deleteButton.RegisterCallback<ClickEvent, int>(DeleteCallback, i);
                safetyToggle.RegisterCallback<ChangeEvent<bool>, Button>(SafetyToggleCallback, deleteButton);
                deleteButton.visible = false;
                e.Q<Label>("DriverType-Label").text = DriversProperty.GetArrayElementAtIndex(i).type;
                e.Q<Label>("DriverType-Label").AddToClassList(string.Format("{0}_Label", DriversProperty.GetArrayElementAtIndex(i).GetType()));
            };
            CustomList.BindProperty(DriversProperty);
            //CustomList.RefreshItems();
        }

Listview is pre-added with only show borders on

the UXML File only has 1 visual element with the ListView on

if i only bind, the list is proper
The moment i introduce custom visual elements this happens

[gusty vapor]

you'd need to make a llocal variable to contain the i or it won't be captured properly

[merry mountain]

thats not the problem, bind item gets called atleast once with an empty view (i tried to isolate it by a direct return if i < 0)

which i get is related to pooling

[gusty vapor]

btn.RegisterCallback<PointerDownEvent>(x=>
{
  int idx = i;
  ///do with idx

});

[gusty vapor]

it willl cause a proble for sure 😅

[merry mountain]

just for curiosity and learning purposes

where does that stem from?

thats the first time i hear of this

the whole capturing issue

Still adds an empty entry (just updating)

also just to illustrate the update

            CustomList.bindItem = (e, i) =>
            {
                int idx = i; 
                e.Q<TextField>("Name-Field").isDelayed = true;
                e.Q<TextField>("Name-Field").BindProperty(DriversProperty.GetArrayElementAtIndex(idx));
                Toggle safetyToggle = e.Q<Toggle>("Safety-Toggle");
                safetyToggle.value = true;
                Button deleteButton = e.Q<Button>("Delete-Button");
                deleteButton.RegisterCallback<ClickEvent, int>(DeleteCallback, idx);
                safetyToggle.RegisterCallback<ChangeEvent<bool>, Button>(SafetyToggleCallback, deleteButton);
                deleteButton.visible = false;
                e.Q<Label>("DriverType-Label").text = DriversProperty.GetArrayElementAtIndex(idx).type;
                e.Q<Label>("DriverType-Label").AddToClassList(string.Format("{0}_Label", DriversProperty.GetArrayElementAtIndex(idx).GetType()));
            };```

[fallow badger]

What is UIElementsSchema directory inside of the project main path?
Shouls I track it in version control?

[gusty vapor]

what is DriversProperty.GetArrayElementAtIndex?

[merry mountain]

Its a list view with a custom class i dont wanna share.

Its only a serializable class that holds a few serialized data (such as string Name per example)

i fetch it like this:

DriversProperty = serializedObject.FindProperty("MyDriversList");

Name of property is renamed for reasons

anyway

The list works normally outside of ListView (per example on a property field)

[gusty vapor]

I mean, you're binding it to itemSource, no?

[merry mountain]

Yea i am

cause i am trying to bind the size reference

i dont want to bind a hard list reference

so i am passing the binding property instead

(on the last line i use List.BindProperty)

i also tried manually setting binding path instead and using Bind with the serialized object

but no difference

(my c is broken ffs)

[gusty vapor]

are your itemSource length the same as your DriversProperty?

debug it

[merry mountain]

i dont use any item source

[gusty vapor]

lmao

[merry mountain]

i am only passing the drivers property

why lmao?

[gusty vapor]

that 👆

[merry mountain]

Yes, but why is that funny?

if i am not using any list hard referene, and im using the serialized property

why is a list needed as a source?

[gusty vapor]

then where it should get the index from ? 😅

[merry mountain]

From the serialized property thats binding

let me clarify something

it doesnt make a difference if i first bind, then define the MakeItem - BindItem callback

[gusty vapor]

it sure does

[merry mountain]

no it doesnt it still adds the empty visual element

i understand logic wise it does

i am testing a lot of stuff here so i keep swapping code around to see what works

at first i first defined the binding then make item - bind item

problem is makeItem (even without having any bindItem defined) gets called without hiding the element

so in other words, even with an empty list, the element is visualised while it shouldnt

[gusty vapor]

so what did youu put as itemSource for your listview?

[merry mountain]

Why do you need an item source, if you are binding to a list property?

i am asking cause thats not documented

if i am using a property as a binding, therefore its the one holding the size and should be "bound", why is an item source needed?

[gusty vapor]

https://docs.unity3d.com/ScriptReference/UIElements.ListView.html

[merry mountain]

https://docs.unity3d.com/Manual/UIE-create-list-view-complex.html

I am not using a list reference

i am using a list property

[gusty estuary]

could you show code of what you are doing?

this convo is confusing as hell

[merry mountain]

check this

Pretty much im saying my list view always adds an empty visual element that has no references when it shouldnt

i get the pooling logic, i mean it shouldnt be populated on the container

especially when the bound list has a length of 0

[gusty vapor]

you're misunderstanding, as youu can see there's itemSource in your link

items there is your itemSource

[merry mountain]

yes but im not using a list source slim

i am binding a list

[gusty vapor]

is that even possible @gusty estuary ?

[merry mountain]

Ofcourse it is, i can just use BindProperty

and the list works

i just want to add some custom visual elements

If i only use bind property list works just perfectly (albeit its ugly as hell)

but the problem is i want to work with custom visual elements for each entry

and that i want to make more complex views

Worst case ill remake list view using a scroll view and a manual pooling solution

[gusty estuary]

I'm not familiar with editor tools

[gusty vapor]

wait, I'm waiting for @gusty estuary to answer mine, he's the god of uitoolkit

[gusty estuary]

I only used it for runtime

aren't there editor ListView samples?

[merry mountain]

https://docs.unity3d.com/Manual/UIE-create-list-view-complex.html

albeit this is for a window

and this does rely on an item source

I could just link the list from the class at this point as a casted target

but i am afraid of possible data inconsistencies

(im making an asset for the asset store pretty much thats why i care for this)

[gusty vapor]

I've been using listview for years in uitk and don't even know that you can do binding without itemSource 😅

tbfh I'm confuse too now

[merry mountain]

Thank you

now we are on the same boat

hahahahaha

but you can just bind it, problem is custom visual elements though

[gusty estuary]

pretty sure under the hood it does use it

[merry mountain]

Yea if i had one complain is that serialized properties is severely under documented in general

same for serialized objects in general

Albeit thats the "preferred" way you should work on, so go nuts

anyway sorry for the introduced confusion

if i use the casted target list ref

this is how it looks

so woop woop i guess

[acoustic trout]

Hey! I have tried for the past week to try create a item slot template (UXML) document and spawn that template into a scroll view with even spacing between each item slot template, however the text does not auto scale, the item slot distorst horizontally and vertically, the image block gets to big.

Is there any tutorial I can follow that works with creating templates and adding them to list view or scroll view containers?

[acoustic trout]

anyone know how to get spacing between the elements?

[gusty estuary]

no such thing sadly

you can insert another element inbetween

and that will be your spacing

[acoustic trout]

Thank you

[cold urchin]

How can I disable a button? theres a pseudo class for :disabled but no attribute to actually disable it

[acoustic trout]

Super frustrated!!!
The item slot looks perfect in the viewport

But the moment I add the slots in via code then it spazzes out. It's off center and cut off by both sides

[cold urchin]

this is why i would never use ui toolkit ever in my life for any purpose its just bloated with defaults and caveats and wierd bugs

[acoustic trout]

There is HUGE potential to using it. Rather learn now then later. Sooner or later the UGUI will become legacy

[cold urchin]

I do know a lot of web development and it is similar but no ide support, forced to override all default styles or completely rewrite the styling, different result on builder and actual game view, dynamic UI is hell, style changing mid game is hell++ and much more

the texture less aspect is very good though
i say it shines the most in inspector and editor ui than game ui

[acoustic trout]

I am a huble backend dev and no frontend dev, so I can not argue with those points.

but I still need assistance 😂

[wispy sage]

You can also add a USS class that define every Child of your list view with a spacing.
The easiest but not perfect way would be to just add an ID selector (#SlotRoot) with a spacing.

[acoustic trout]

I got the spacing working just fine however the issue is the alignment from left to right .

In the builder it looks great

[wispy sage]

I would recommend at runtime using the Uitoolkit de bugger. You might see what is overriding your property

[acoustic trout]

the moment the game starts it all goes to shizzz

[wispy sage]

Do you use the runtime USS provided by Unity ?

That explained a lot of my problem.

[acoustic trout]

uhmmmm if I ask what that is, does that answer your question ?>\

😂

[wispy sage]

Can you show which Panel settings do you use on UIBuilder ?

[acoustic trout]

random created one

1sec

[wispy sage]

Because you can use the editor or runtime one.

[acoustic trout]

😕

Let's start a thread

[wispy sage]

On the top right of UiBuilder you should see wich TSS file it use.

[wispy sage]

Yes please.

[gusty vapor]

If you're looking for the children to be equally spaced use flex-wrap and set the margin on the parent

justify can also do that too, there's a spaced-between option iirc

[small wigeon]

is "editor-extension-mode" for editor windows?

hmm, for anything editor? I was thinking it's for custom controls or something

[gusty vapor]

@gusty estuary you're still facing Layout Struggling error on your listviews in 2022 lts ?

[gusty estuary]

I haven't worked with uitk in lts yet

also, I fixed that error long ago

[gusty vapor]

man this sucks

i'm working on Spine binding with uitk and listview it keeps spewing that sh*t

[gusty estuary]

try to get rid of all padding and margin on elements

that was something that helped me

kekw

[gusty vapor]

I'm not using any paddings nor margins

I really want to upgrade to lts but still waiting for next version

this old 2022 version I'm using kinda sucks

[gusty estuary]

why not update?

I feel fine simply saying "old version sucks, update"

😅

[gusty vapor]

do you know a trick to make sure the 1st added child will always be placed at the bottom most? without absolute

[gusty estuary]

in fixed layout?

I'd just split container with sub containers

[gusty vapor]

not quite sure what fixed layout in this context

[gusty estuary]

I mean, not dynamic

as in

you are not adding new elements

in runtime

[gusty vapor]

this would require massive overhaul, which I'm trying to avoid, bcos, you knnow it wiill introduce new bugs

[gusty vapor]

it's complicated, so it's custom editor but it will sync up with elements on scene view on runtime too

they both run synchronously

[gusty estuary]

🥴

[gusty vapor]

even tho the other one is custom editor

[gusty estuary]

can't you just insert elements instead of adding?

[gusty vapor]

so to answer your question, no, it's nnot fixed layout

[gusty vapor]

OH! I honestly never done this before

can youu elaborate?

or how it works

[gusty estuary]

myCont.Insert(0, myChild);

[gusty vapor]

my understanding is that inserts work when they all already present in hierarchy

[gusty estuary]

no

it's same as list

thus the name

[gusty vapor]

oh.. my... god

I will just do that!

thanks! 👍

[gusty vapor]

@gusty estuary why my listview always showing horizontal scrollbar even when I disabled it?

[gusty estuary]

🤷‍♂️

I'd check that you set proper attributes for sure

[gusty vapor]

ah I remember this issue, it's a bug\

[gusty vapor]

Found the what was the issue, it was GeometryChanged

[gusty estuary]

classic

[gusty vapor]

apparently, it happens when re-parenting during this event causing it to be recursive, which is make sense

[acoustic trout]

Hey! I am trying to create a carousel scroller with the Ui toolkit. Has anyone had any success doing something like this ? Any advice would be great.

[gusty estuary]

it's definetely doable

you can use transform property of VisualElement to rotate element

and position it properly in your carousel

[acoustic trout]

The idea is to have a list of items like a slot machine and you could scroll up or down infinitely
The best I can think of is to just detect the scroll direciton and should the user get to the end of the list remove the last element opposite the scrolling direction and add it to the last element of the scroll direction

[gusty estuary]

oh

🤔

I guess you'd need to just move elements via transform

and properly reposition them

when they are out of view rect

[gusty vapor]

it can be tricky for infinite loop scrolling due to resolved/unresolved nature of visualElement in uitk I can imagine

[novel fern]

Hi, I need to change rotation of VisualElement by code, and have troble achieving that

StyleRotate style = element.style.rotate;
Rotate rotate = style.value;
rotate.angle = new Angle(angle);

have sth like this and this does not work

I've got it working

Rotate newRotate = new Rotate(angle);
element.style.rotate = newRotate;

[gusty estuary]

it would just resolve every move

you simply modify transforms of all elements

to simulate that scroll

nothing tricky actually

just a lot of work

😅

[gusty vapor]

what I meant, ideally you'd need pooling for infinite scoll, combined with dynamically binding the data, it would be tricky still

[gusty estuary]

why?

much easier would be to manually resolve layout rects in your code and just avoid moving elements which are not meant to change visibility

so engine only resolves what has actually changed visibility

[gusty vapor]

and making sure they're binded successfully and the styles are solved already.. would be a mess I think

[gusty estuary]

that's overcomplicated and I doubt it'll provide better performance

especially considering rebinding will take recalculation of everything: text, element layout

and saving memory is probably least of concern these days

[gusty vapor]

on mobiles they're mattered regardless how powerful your handset is

[gusty estuary]

memory?

[gusty vapor]

efficiency in general

[gusty estuary]

but is it more efficient?

you save on memory, by recalculating everything on the fly

[fiery mountain]

I was thinking of how i would approach making a minimap with fog of war. What approaches would you all use for that?

[gusty vapor]

not quite sure what it looks like in that game, but most common way is via renderTexture

[gusty estuary]

yeah, I don't see a reason to implement it via uitk

[fiery mountain]

Yeah I was thinking of some ways to possibly do it with a render texture with fog etc in the ui toolkit but might even go to ugui for that specific part

[wispy sage]

Third time the charm, but I would be curious to try to animate a Spritesheet on UItoolkit.
The catch is that I don't want to do it from a Gameobject that gets a reference to a Visual Element but directly within UITK code, from a Custom Visual Element.
Basically, so that my graphic artist can preview it directly in UIBuilder.

To achieve that I need to have a list of sprite accessible there, and apart from Resource or AssetDatabase, I don't see any way of achieving that.
Does any of you have an idea on how to get a list of sprite ?

[gusty estuary]

UI Builder doesn't have any built in ways to access any data outside. So static resources is your only choice for preview code

[wispy sage]

Yep ! That was my feeling too.
Honestly, the only good solution would be to be able to parse a Texture, but no API provides that.

[gusty estuary]

you can use string attributes

like binding path

to find matching asset

and to do UIBUilder only logic

you can use AttachedToPanelEvent from constructor

UI Builder panel has specific name

(and potentially some other data that lets you identify it)

so this way you'll be able to set up all required data

[gusty vapor]

Pretty sure it will work with Image class in uitoolkit.. I mean same concept as legacy ui

var img= new Image();
img.image = myRenderTexture;
camera.targetTexture = myRenderTexture;
img.MarkDirtRepaint(); //Repainting may not be necessary

Image class used to be not accessible in uibuilder, not quite sure now

I'm expecting it's available in 2022 lts at least

@fiery mountain

[wispy sage]

i'm really not sure I get you, I wanted to get a Texture 2D that is a Sprite type multiple, and check all of it's sprite directly, basically.

[novel fern]

How can I instantiate VisualElement asset without wrapping it in TemplateContainer?

[gusty estuary]

there's Clone method

[novel fern]

CloneTree method on VisualTreeAsset also returns TemplateContainer

[wispy sage]

Yep, you wanted to get which element ? :).

[gusty estuary]

there is an overload which instantiates into specific element

why TemplateContainer is even a problem though?

it's not affecting anything

[small wigeon]

you can reference a sprite in uitk, but how is it animated?

[wispy sage]

I would do a simple system, telling my artist that hey can define a "time after time" for each sprite, and then I would just loop and change the background image of my element every X time.

[small wigeon]

just have a list of sprites and a delay between them?

[wispy sage]

Basically, I could not animate the sprite alone.
But I think my solution would be to have a SO, that I would pass into my Custom Visual Element and then the magic occurs.
Sadly I would not be able to fake that in editor, apart from using AssetDatabase for the editor part, and passing the data from the runtime one.

[wispy sage]

Basically, that would be enough for my artist to animate their element.
It's just that I wanted to avoid passing a list on runtime from the code (Which make my artist dependent on my code) and using asset database for editor, but that's okay I guess :).

[small wigeon]

why can't you do it in the editor?

[wispy sage]

I need to pass the Array of sprite into my custom VisualElement.
Currently UITK only define string, bool, float, int, enum. So no way of passing the data, just like you would do with a Gameobject.
So at Editor time, I would use the AssetDatabase API

[small wigeon]

maybe you can do it with custom styles

the background allows the use of a sprite directly, but I can't find where the editor part of that is, it might be internal

[gusty vapor]

You can do frame-by-frame animation in uitk pretty easily, this is mine, which I made it many years ago in early version of UItk
and it runs in Custom editor/edit mode

[small wigeon]

but how do you reference the data in ui builder?

[wispy sage]

Would you have access to the source code ? :).
My point is that I would like it to play within UIBuilder.

[wispy sage]

Sadly cannot !

[small wigeon]

you would have to make a bunch of custom styles like background-image-0,background-image-1,...background-image-16

[gusty vapor]

I never used uibuilder, I hate uibuilder, so all code.. @gusty estuary should know how

uibuilder is the jankiest uiux tool I've ever seen in my entire life 🤮

[small wigeon]

it's been a while, but qt's qml editor was much worse

ui builder works, my main issue is always with flex and styles

[gusty estuary]

custom styles is a thing?

I remember seeing some mention about it, but I never actually found any reference

[small wigeon]

https://docs.unity3d.com/2022.3/Documentation/Manual/UIE-create-custom-style-custom-control.html

[gusty vapor]

you should learn how to Custom-Editor lots of demands for this

[gusty estuary]

huh

that's pretty cool

[wispy sage]

Actualy no, how I would have tought of it would be to ...
1/ Get the background image, that would be the Texture set as SpriteMultiple
2/ Get from a non existant API (Hence the Resource Load), each sprites set by the artist
3/ Loop into each of thoses :).

[gusty vapor]

thats the way to do it yeah

[small wigeon]

can you not just create a TypedUxmlAttributeDescription with Sprite?

[gusty vapor]

just use Image class for this stuff, it has the scaleMode which is unique to it's own

[small wigeon]

from ugui?

[gusty vapor]

it used to be in experimental which means not available in UIbuilder

[gusty vapor]

UIToolkit

not quite sure if it's available in 2022 lts already

[small wigeon]

hmm I don't see it

[gusty estuary]

switching style for animation is not really great though

[gusty vapor]

yeah, it's not out of experimental just yet probably

just use code

[gusty estuary]

you can actually define it in uxml

and it'll work in ui builder

but since UI builder doesn't support any custom inspectors - you'll need uxml/code to use it

[small wigeon]

is it all completely internal to unity now? I'm having trouble finding stuff

[gusty vapor]

it's undocumented, as said, experimental

also Image class can do vector graphics which is neat

[small wigeon]

ah, it's all com.unity.modules.uielements now

which is why I'm having trouble following the code

ok, it looks like Image is available in 2022.3

and it does support sprites

and it uses custom styles to do that

[gusty estuary]

what?

did they improve UI BUilder?

[gusty vapor]

oh nice, it's out of experimental then

now ditch out all your backgroundImage s and use Image instead 😄

[gusty vapor]

it support lots of stuffs, not just common sprites

vector graphics ftw

[wispy sage]

That would be, but I would have access to one image, I would like access to a LIST of images, which is not "drag'n'droppable".

[wispy sage]

Why tho ?

[small wigeon]

I don't see how to use it in UIBuilder though

[wispy sage]

The main problem is not coding the feature, but having an access because Unity editor <-> UIbuilder to drag the data.

[gusty vapor]

I mean what stopping you from doing that? as shows in my .gif screen shot, all those are sprites in assets folder

you can recursively bulk load those sprites in a list then do your way from there

[wispy sage]

Because on your editor element you can declare a Custom type, where you can drag'n'drop your property.
On UIBuilder I'm blocked by the 5 simplest type, meaning I cannot drag'n'drop a list of sprite to play with it on code.

[wispy sage]

Yes, and how would you do the load, at runtime, without using Resource folder or asset database ?

[gusty vapor]

😅 which means, it's still hidden,,, proly not out of experimental just yet 😄

you can still use it tho, with code

var img = new Image();

and do your stuff with it.. it may conflicted with the legacy ugui Image so you'd need to fully declare the namespace too

[small wigeon]

looks like there's no way to set the custom styles in the inspector

[gusty vapor]

nothing wrong with Resource.Load<T>(path)

[gusty vapor]

save the path in edit mode.. and on runtime you can just do Resource.Load<T>(mypath[i])

so you don't need to recursively looking for them over and over

[wispy sage]

I find it quite odd to have to use the Resource folder specifically just for that, I would it avoid it overall.
Also it means that my assets would be present there, so I'm against it.

I would at least prefer using the Addressable pipeline, which is better.

I'm just surprised that we still don't have a Texture API letting you access to the Sprite "attached" to it.

[gusty vapor]

wdym? Regardless what you do, all your in-game assets will always be tagging along your game installer 😄

resources folder is very handy

you can have tons of Resource folders in your projects, on runtime they all will be in 1 place

[wispy sage]

Handy yes, but not quite optimized, the fact that if I Don't use the data, it's still getting loaded, it's not a good practices.
I don't want it to be referenced by path also, but by reference, so if an artist change the name, he's not stucked & getting a null ref.

[gusty vapor]

you don't normally work with hard-coded file names in a project, instead you work with GUIDs

https://docs.unity3d.com/ScriptReference/AssetDatabase.GUIDFromAssetPath.html
https://docs.unity3d.com/ScriptReference/AssetDatabase.GUIDToAssetPath.html

Your artist can rename it to whatever he likes, the GUID will still be there

[wispy sage]

Yes for sure, but just having resource that bloat my file size, for me it's bad.

Thank you for all of your feedback, I'm able to pinpoint, what I should do around that :).

[merry mountain]

For future reference and if someone uses the search in the future:
IF anyone is facing a problem with custom ListView Visual Elements specifically for serialized properties, the official unity answer is:
"This can lead to unexpected behavior, please instead use a custom property drawer for the entries"

MakeItem and BindItem are not to be used with these in pair, which is only more confusing

[small wigeon]

it looks like the inspector is set up somewhere else, I can't find it in the uitoolkit module

but it looks like it would be pretty simple to support custom properties in the inspector

[acoustic trout]

Hey So I have my list of visual elements added to the scroll view. I update this list by adding the Index of the first element to the end of the list, however my scrollView does not update. Is there any way to sync the scrollView element order to the order of my VisualElementList?

[gusty vapor]

you should reconstruct the whole Scrollview

what you want is ListView.. it has data binding ootb

[acoustic trout]

I am curious though, does the scroll view allow for content wrapping ? Like, I can keep scrolling and the elements will jsut wrap around and I can just keep scrolling forever

[fiery mountain]

yeah they wrap

if you had a list view, you would just have to make sure it's set to dynamic height not fixed height

[gusty vapor]

woah they let us access the pool data for ListView in 2022 LTS

https://docs.unity3d.com/2022.3/Documentation/ScriptReference/UIElements.BaseListViewController.html

not as straightforward but that's fine

now I can remove bunch of reflections ✨

[gusty vapor]

oh it's been there since latest 2022.2 apparently

still nice

[hushed meteor]

How can I add a new item to the list view? When I click the add button on the list view, a new item is added. However, the new item is null which is not the type I want.

[gusty vapor]

what type is your itemSource? custom class? listview can't do add/remove via built-in addRemoveButton buttons on nested custom classes

easy to workaround

                Action<VisualElement, int> bindItem = (e, i) =>
                {
                    var vb = (VisualElement)e;

                    if (itemSource[i] == null)
                    {
                       myItemSource[i] = new MyClass();
                        //Do things to your nested stuffs
                    }

                    //No longer nulls, fill in your other stuffs 
                }

yes, just do that in your bindItem

[hushed meteor]

Thanks, I will try

[gusty vapor]

on deep nested classes, the instance will be created successfully by listView but the bindings can't be done due to your other classes/types in that deep nested class won't be instantiated by listView, so just do that via your bindItem template as shown

if that sounds like a hassle, you can just use your own buttons to add/remove the itemSource then Rebuild after each of those events

[gusty vapor]

@gusty estuary what's the best way of changing the order of visualelement in uitk?

insert requires to be removedd from hierarchy 1st, right?

[gusty estuary]

yeah

not sure tbh

check, maybe it has some LIst-like api

[gusty vapor]

this is dumb```
activeVToolbar.toolbarOneMain.RemoveFromHierarchy();
activeVToolbar.toolbarFourMain.RemoveFromHierarchy();
activeVToolbar.toolbarTwoMain.RemoveFromHierarchy();
activeVToolbar.toolbarThreeMain.RemoveFromHierarchy();
activeVToolbar.InsertToolBar();
rootVisualElement.Insert(1, activeVToolbar.toolbarOneMain);
rootVisualElement.Insert(2, activeVToolbar.toolbarTwoMain);
rootVisualElement.Insert(3, activeVToolbar.toolbarThreeMain);
rootVisualElement.Insert(4, activeVToolbar.toolbarFourMain);
rootVisualElement.MarkDirtyRepaint();

and hella slow than just reconstruct those from scratch

[gusty estuary]

I don't think you need this rootVisualElement.MarkDirtyRepaint(); 😅

[gusty vapor]

this is editor window,, it's a must

unlike runntime stuffs

[gusty estuary]

take a look at implementation of Insert

maybe you could just do some faster way directly

all API is exposed afaik

[gusty vapor]

basically im trying to get as less overhead as possible, even in editor mode, those will often be updated every 5 seconds at least

Inserts are just too f'ing slow

[gusty vapor]

ah man, why there's no easy way to change the order in hierarchy

this is so sad

[gusty estuary]

it involves recalculating layout in any case

I don't get though, why can't you just modify internal list position

it should be as performant as swapping 2 objects in a list (excluding layout ofc)

[gusty vapor]

this is not related to list.. it's a massive giant ass toolbars that keep updating in certain intervals on runtime
Note, those toolbars are Custom Editors and must be sync up while in play mode in editor

reconstructing expensive but faster than Inserts

btw @gusty estuary i remember saw my colleague did this to visualelement vis.this[0][6]

is that changing the order in hierarchy?

[gusty estuary]

🤷‍♂️

you can check source

actually

it looks like accessing 7th children of first child of this

[gusty vapor]

ooohh...lemme check

[gusty vapor]

refactoring this piece of poo 😭

[gusty vapor]

@gusty estuary see this https://docs.unity3d.com/2023.2/Documentation/ScriptReference/UIElements.ListView.html

lots of fancy stuffs in 2023

this one is interesting

[gusty estuary]

Add?

huh?

[small wigeon]

if you're moving elements shouldn't you just create a container to group the things that are changing?

[gusty estuary]

grouping is part of styling and affects layout

so it's not something you do just for "folder"

[small wigeon]

manually moving elements affects layout too

[gusty estuary]

that's not what I meant

I mean, if your elements for example using row direction and you add element just to group things inside - children of that element will use list direction

[small wigeon]

easy enough to fix, I'd rather just fix up the styles than write code

[stuck pond]

Hey there,
Trying to work on a basic pause menu. Does anyone happen to have any Guides or Asset Store assets I could have a look into?
I would prefer if the menu UI can support a controller, as well as M&K

[small wigeon]

you can see the dragons crashers sample in the pinned post

I dunno of any examples of controller support

[gusty estuary]

Controller support is built in