#world-ui-design

1 messages · Page 2 of 1

polar wolf
#

you cant get xy of the default curser

#

but you can use that prefab which does its own raytrace

feral igloo
polar wolf
#

Iirc it just works as is

#

We use it for the hyperbeam integration in ls media

stone herald
#

Hey if your good at Doing UI Work Please Message Me in a PM I need to pick your brain about somethings Please

faint glade
#

What shader do I need to use for the UI text?

#

I cant find one that looks right

polar wolf
#

Unity legacy text can look really scuffed when scaled

scenic egret
#

Had to do custom sorting for some sprite based UI panels since Unity's sorting is a bit too inaccurate to handle it correctly in all scenarios

fair cargo
#

I suppose then it comes down to a question on why you wouldn’t just use separate Canvases… unless you are trying to keep your Batches lower.

scenic egret
#

Canvases suffer from the same sorting issue as sprites, they get sorted based on distance from the camera using the center point of each canvas

#

Would have to manually calculate their sorting layer order in the same way

#

I ended up raycasting to the corners of each panel from the camera and keep track of the intersections with other panels then topo sort the objects that way

glass iron
#

I have noticed stuff like that happening with my canvas too, and I usually try to mess with the layer ordering, but that seems to also have weird results sometimes.

timid garden
#

how do i create a dropdown menu?

fair cargo
timid garden
fair cargo
#

Getting the selection will require you to read directly from it

timid garden
fair cargo
#

First, ensure you have your options in the Component

#

Then, ensure that there is a VRC UI Shape and Box Collider on the Canvas

#

Finally make sure it’s layer is NOT UI

#

Note, the only big difference between VRC UI GameObjects and the ones you get by defaulting Unity is that they are configured to be plug-n-play setup for VRChat

#

Meaning the Canvas will start as a World Space UI, it will have a VRC UI Shape on it by default, It will be setup with VRChat’s UI shader made to ease readability in VR, and it will have Navigation OFF.

timid garden
deep dock
#

anyone know how to make an event fire when a button is first hovered, and then is stopped being hovered over?

i tried this: #udon-general message
but it doesn’t work in vrchat. only in unity

#

i want to make a tooltip system, so when you hover over a button it sets an animator bool to on, and when you stop hovering over it, it sets the bool to false

#

but all i need to know is how to get an event from a button when it’s hovered over and then not hovered over

still oxide
#

Can someone explain how so when you click a button it opens a tab

#

For my case I have a button on a ui canvas and when you click that I want it to come up with this bit what players can read about the world I tried following a tutorial but the code wouldn’t work (not really a programmer more a designer

tiny whale
still oxide
#

No

#

Not a window but on the ui

tiny whale
#

were you following a tutorial specific to VRChat? UI elements are set up a bit differently in order for them to work for VRChat
you could possibly edit what you've got to make it work

still oxide
tiny whale
still oxide
#

Okay thank you I’m going to watch videos on coding basics vrchat as I don’t know much about it

tiny whale
#

a basic Udon tutorial I can probably find
you'll want to look at Udon and UdonSharp I suggest, and figure out which looks easiest for you

#

I watched Vowgans tutorials back in the day but they might be outdated...

tiny whale
# still oxide Okay thank you I’m going to watch videos on coding basics vrchat as I don’t know...

usually a "gameobject toggle" script is a good one to start with
https://www.youtube.com/watch?v=ibDu0dCeUE8&t=0s

YouTube
Vowgan VR
Toggle Buttons (August 2020) | VRChat Udon Tutorial

With the recent Udon updates, some of the basics have changed, so here's my most basic tutorial redone with the new editor, and not recorded at 2am! If I get enough requests, I'll redo my "Contextual Buttons" video as well, which will give me an excuse to just rename them "Event Buttons" which actually makes sense.

00:00 - Intro
00:20 - Udon Gr...

▶ Play video
#

Vowgan is nice bc he'll show it in Udon and U#

#

if you think outside of the box you can do SO much with just toggling gameobjects. it feels like cheating sometimes

still oxide
#

@tiny whale I know this is weird but is there a way we can call so I can show you the errors and you tell me how to fix them and answer some of my questions

tiny whale
#

no just screenshot the errors

still oxide
#

Okay

#

I’ll send you the script

#

So he in the vr hat ui button tut is says his name for the button is button mine is information so I used jnfomation where he uses button but it says it can’t find information

IMG_9634.jpg
#

There the errors

tiny whale
#

yeea so

#

private infomation _infomation

#

you're delcaring a private variable of Type infomation (doesn't exist)

#

oooh also. your Visual Studio is disconnected from Unity

#

hence why it can't find GameObject (does exist)

#

usually just have to close the files in VS, then close and reopen it

#

oh wait no you've misspelled GameObject as GameOject

still oxide
#

Oops

#

So how do I connect unity and visual studio neck did wonder why mine wasn’t popping up with names and stuff while his was

tiny whale
#

usually just have to open the .cs file through Unity (doubleclick it in the file explorer in Unity), but there's also a setting somewhere to specifically tell Unity to use VS as your editor

#

ah yeah here

#

go to Edit > Preferences

#

then to External Tools in this window

#

at the top of this window you can select your "External Script Editor", which should have Visual Studio selected

image.png
still oxide
#

Is that it or do I have to regenerate project files ?

tiny whale
#

no just set the External Script Editor

still oxide
#

Okay

#

Is there anything I should change in my script and how do I make it so when you press the button the text appears

tiny whale
#

yeah
you shouldn't need the private infomation _infomation at all for a GameObject toggle script, just set target as what you are going to toggle
unless you plan to do something specific with the UI button
a custom button also shouldn't be a custom type or class, it should be TMPro.TextMeshProUGUI or the Unity UI equivalent

#

I think depending on how you set it up, make sure a UI button is configured to call ObjectToggle()

still oxide
#

So when he write out the name of his button do I write out mine and if what he’s toggling name is like something I write the name of what I’m toggling I’m guessing that’s really confusing

#

But how do I spot when he using the name of his object

tiny whale
#

I don't really think so.... you usually don't have to put the button itself in a script in most cases.....

#

the button is just the "sender" of the function that does other stuff (like toggle a gameobject)

still oxide
#

I also have these errors but I have deleted the script and I don’t know what the othered are

IMG_9636.jpg
tiny whale
#

something is being set to null (which means it's being set to "nothing") when it's not supposed to be
a lot of times it's Unity being weird and it can be ignored, but if it were to be coming from your own script it might be a problem

#

that is coming from Unity though so it should be fine

still oxide
#

Yeah ever since I started ui coding is when I have been getting errors I haven’t had errors in this project since now

tiny whale
#

yeah you just kinda get used to them at some point tbh

still oxide
#

I’m going to have to now as I don’t know really how to code

#

But is there a way of deleting that script fully so I don’t get them errors

tiny whale
#

delete the component off of anything you put it on, then delete the .cs and .asset file for the script

#

lemme see if I can make you a better example

still oxide
#

I have these errors now @tiny whale

IMG_9637.jpg
tiny whale
#

dunnae what you've done

#

there's more errors if you scroll up

still oxide
tiny whale
still oxide
#

Yes

tiny whale
#

you've still got your "infomation" script in the scene

#

here's a prefab and the scripts to look at

still oxide
still oxide
#

@tiny whale So I was trying to follow everything in that in the prefab (except the green bit) but these errors came up

IMG_9640.jpg
#

This is going to be a long project because you don’t even want to know what the other things I have to code

tiny whale
#

Did you edit the script at all....

#

Ya better start learning to code boy

still oxide
#

Do I just re write script

tiny whale
#

it shouldn't be getting an error as simple as "} expected" if it worked fine for me

#

if you open it in VS it should tell you exactly where the bracket is missing

#

my script also doesn't have a "TargetObject" variable. it's only got "targetObject" (case sensitive)

still oxide
#

I did it and there no errors with script but the button isn’t working so I need that script string

#

I can’t get the one you use

tiny whale
#

are you not using the prefab I included....

still oxide
#

Also getting these errors

IMG_9642.jpg
tiny whale
#

regenerate network IDs

still oxide
#

I’m so sorry about today

tiny whale
# still oxide

here you put the script itself into the button's target. this is incorrect. you need to put the GameObject that has the UdonBehaviour on it in that slot

still oxide
#

What do I put in each box

IMG_9643.jpg
tiny whale
# still oxide What do I put in each box

in the UI button's slot (where is says OnClick()), you need to put the GameObject that you put the script on. Judging by the screenshot it is also THIS object that you have selected. So drag it in from the Hierarchy
The "Target Object" variable needs to have WHAT you want to toggle. this should be the panel you want to have toggled

#

oh and in the OnClick() spot, you'll know you've done it right when the dropdown has "UdonBehaviour.SendCustomEvent (string)" as an option

#

select that, then in the box put the EXACT name of the function you want to have it call. This function also needs to be set public in the script in order to work

still oxide
#

I will say I am sorry about today I just needed help as I need to do 5 other buttons and this will also help if I need to do anything else

tiny whale
#

don't have to apologize for learning

#

we were all in your place before

still oxide
#

So I have put it all in

tiny whale
#

looks good so far

still oxide
#

There’s the script

tiny whale
#

looks good

#

now press button

still oxide
#

Right so for some reason it has compiling errors but there others tabs open vs do I close them

tiny whale
#

uh sure

still oxide
#

There’s the errors

tiny whale
#

the name of the file and the name of the class must be the same

#

if you rename the files it'll break them

still oxide
#

What’s a class

tiny whale
#

that bit

deep dock
#

is there a way to make the fill of a slider come from the middle?

#

for example, i have this post processing menu

image.png
#

for all except the bloom, it would make more sense for the fill to originate from the middle, because the values go both negative and positive

still oxide
#

@tiny whale So the script has been changed the name and everything but still nothing I was thinking that it might be the thing where you put what you want it to do as it’s not working

tiny whale
tiny whale
still oxide
#

Nope

deep dock
tiny whale
still oxide
still oxide
tiny whale
#

oh.... then what is it not doing that it should be doing

tiny whale
still oxide
#

Let me see which ones I’m using

tiny whale
#

if you just spawn a basic UI button VRC can't use it. You'll know it's working if your lasterpointer cursor works on it

still oxide
#

So I made a vrc button and did it all but still nothing working

tiny whale
#

can you at least click it? like you see your cursor over it and when you click it changes color a little?

still oxide
#

No

#

Nothing

tiny whale
#

then it's not a VRC UI button

deep dock
#

or, is there a VRC Ui Shape on the canvas?

tiny whale
deep dock
#

if the pointer doesn't even show up, it's the canvas itself, not the button

still oxide
still oxide
tiny whale
#

is it on a canvas? it's supposed to create a canvas for you, but if you have a canvas already it might not make a new one

deep dock
#

show the full hierarchy of your button

deep dock
#

because it's outside the collider the VRCUiShape creates for it

#

all of your interactable UI elements need to be inside the bounds of the canvas. (sliders, buttons, etc)

still oxide
#

How do I make sure of these things

deep dock
#

you... place them inside the canvas

#

canvases render an outline

tiny whale
#

it's a big white square when you select it

deep dock
#

as long as gizmos are turned on, they will always render a white outline to show the bounds

still oxide
deep dock
#

okay well it looks like they are fully inside it

#

can't really tell because you didn't show the entire canvas, but looks like it

still oxide
#

They are

deep dock
#

you also didn't necessarily answer my original question. did you add a VRCUiShape component to the Canvas object?

still oxide
#

What’s that

deep dock
#

it creates a box collider for your canvas when the game starts, which allows you to interact with it and use your pointer

#

if you don't have it, you cannot interact with the canvas

still oxide
#

How do I make one or check for one because we might of found what’s wrong

deep dock
#

click your Canvas object

#

add component

#

VRCUiShape

tiny whale
#

click on your canvas and look in the Inspector for this

image.png
still oxide
#

I added it to the canvas

tiny whale
#

aight now try it

still oxide
#

Okay trying it now

#

Still not working

deep dock
#

can you take a video or clip of you testing it?

#

it’s really hard to help when we can’t see what’s actually happening, or most of your hierarchy and components

still oxide
#

Ofc

#

The white button isn’t working a prefab that @tiny whale Made I think

deep dock
#

is there any sort of collider that’s blocking the canvas?

#

if it’s inside of your wall collider, or behind any triggers or anything, you won’t be able to use it

#

so make sure it isn’t being obstructed at all

still oxide
#

Nothing is obstructing it

tiny whale
#

you get the cursor when you look at my button, but not yours

#

so there's a difference between them that's missing

still oxide
#

We need to find out what

deep dock
#

can you send a screenshot of the hierarchy of your button and canvas? and also, the inspector of your button and canvas.

#

quick tip, holding Alt and clicking the arrow of a hierarchy object will expand or close every single child object of that parent

still oxide
deep dock
#

i don’t even know what that menu is

#

i meant the big list of objects in your scene

still oxide
#

There’s the button hierarchy

tiny whale
#

that's not your hierarchy....

deep dock
#

it’s usually the panel in the top left sea

#

yeah that’s the search menu

still oxide
#

Button inspector

deep dock
#

okay so your button doesn’t even have a canvas…..

#

and you added the UI Shape to the button

#

which, it’s supposed to be on the canvas

#

which you don’t have

still oxide
#

I put it on the canvas but also put it in everting just to make sure 😊

deep dock
#

no

#

don’t do that

#

it only needs to be on the canvas

still oxide
#

How do I connect canvas and buntton together

deep dock
#

also, in the picture of your hierarchy, i would not even be able to tell you have a canvas

#

i can only see a couple objects

still oxide
deep dock
#

okay and then what does the inspector of your canvas look like

still oxide
deep dock
#

OH

#

it’s on the UI layer

#

that’s bad

#

put it on default

#

if it’s on the UI layer, it means you can only interact with it when your quick menu is open, because it’s on the same layer as VRC’s UI

#

layers aren’t just categories of objects, they change the way collision works, with raycasts, rigidbodies, players, etc.

still oxide
#

Do I change it for all child objects or just the canvas

tiny whale
#

so it sounds like when you first created the canvas and buttons, you didn't use the VRC option

deep dock
#

all children

still oxide
#

So now will it work

deep dock
#

test it

still oxide
#

Okay so now the cursor is popping up but the button isn’t working (not bring up other canvas with text on it)

deep dock
#

okay progress

#

can you send a picture of the script on your button?

#

just so we can see what it currently looks like

#

make sure it’s correct

still oxide
deep dock
#

okay a lot of unnecessary spaces, but should be working

still oxide
#

The names have been changed this is a old pic of it

deep dock
#

oh, what names were changed?

still oxide
#

The class

#

I’ll bring up new script

deep dock
#

okay, can you show a picture of the hierarchy of the “information tab” object, and show what it looks like in the scene too?

still oxide
#

(Did only just realise that’s there’s a text option it the canvas

deep dock
#

why do you have a whole canvas, that is parented to the main canvas

obsidian sequoia
#

It’s gone

still oxide
still oxide
obsidian sequoia
#

Yes but where’d the top part go

still oxide
obsidian sequoia
#

This

still oxide
obsidian sequoia
#

Oh

deep dock
still oxide
#

So do I just make it text

#

And delete the extra canvas

deep dock
#

yes, exactly

#

that’s what i would say

still oxide
#

I deleted the canvas and it doesn’t work still but it looks simpler anyway

#

I also just want to point out the the curse is all over the canvas and not just in buttons

still oxide
deep dock
#

your buttons don’t still have the UIShape component do they?

still oxide
#

No I deleted the component off of it

deep dock
#

they aren’t placed in front of or behind the canvas at all right? as in, the Z position of them is zero?

still oxide
#

I set z position to 0 it was on 0.6

deep dock
#

try it now

still oxide
#

Still not working

deep dock
#

the text of your information tab isn’t large enough to cover the buttons is it?

still oxide
#

I got it working kinda where now when you press it it changes colour and when you hover over it changes colour but the text won’t show up

deep dock
#

did you type anything in the text’s text box?

still oxide
#

Yes

deep dock
#

and are you sure it’s positioned and scaled to be visible?

still oxide
#

Yeah

#

Should it be on a certain layer

deep dock
#

no

#

can you show what it looks like in the scene?

#

the info text that isn’t showing up

still oxide
#

Is that what you meant

deep dock
#

uh, in the top right of our scene view, there’s the Gizmos button. the icon kinda looks like an atom

click the dropdown arrow next to it, and find the “TMProUGUI” icon, and click on the icon. that’ll toggle those huge images off so you an actually see

still oxide
deep dock
#

so where’s the info text that’s supposed to toggle? i’m not seeing it there, unless it’s “welcome to the oasis bar”

still oxide
deep dock
#

alright, and when you go test, it isn’t there on start, and nothing happens when you click the button?

still oxide
#

It ain’t there at the start and when I click the button it doesn’t pop up but the button works when I click it it changes colour

deep dock
#

are you sure the “SendCustomEvent (string” that the button is set to, is the exact same name as your “ToggleObject” method in the script? it’s case sensitive, so if anything is slightly wrong it won’t send the event

#

(well, it would send the event, but if it’s misspelled it sends the wrong event)

still oxide
#

So what do I change to toggle object

deep dock
#

so if you copy that text, and then paste it into the button’s OnClick event, is it the exact same?

still oxide
#

Thank thank thank you @deep dock & @tiny whale Sorry for this but I couldn’t do it without you it works

tiny whale
#

you're almost there I feel

#

did you double check that the UI button is targeting the object that has the script?

deep dock
#

i believe he just said it works

tiny whale
#

oooh I didn't get that implication lol

#

well good job

#

I don't really blame you for the troubles VRChat handles UI buttons in a weird and specific way, with many cases that it's difficult to tell if its working or not

still oxide
#

Also quick question is there a way so when you click the button you can have multiple things pop up

scenic egret
# deep dock is there a way to make the fill of a slider come from the middle? 
using UdonSharp;
using UnityEngine;
using UnityEngine.UI;

[RequireComponent(typeof(Slider)), UdonBehaviourSyncMode(BehaviourSyncMode.None)]
public class CenteredSlider : UdonSharpBehaviour
{
    private Slider Slider;

    void Start()
    {
        Slider = GetComponent<Slider>();
        UpdateSlider();
    }

    void OnEnable() => UpdateSlider();

    public void UpdateSlider()
    {
        if(Slider == null) return;
        Slider.fillRect.anchorMin = new Vector2(Mathf.Clamp(Slider.handleRect.anchorMin.x, 0f, 0.5f), 0f);
        Slider.fillRect.anchorMax = new Vector2(Mathf.Clamp(Slider.handleRect.anchorMin.x, 0.5f, 1f), 1f);
    }
}
image.png
deep dock
#

huh, nice

#

thanks

still oxide
#

Sorry @deep dock how do I make it so when you click a button it come up with multiple things pop up

deep dock
#

that would be a dropdown. but i can’t really help as i haven’t used a dropdown myself

still oxide
#

What is a panel ?

#

I’m trying to find out how I can make it when I press a button it brings up more buttons and text and images

agile dragon
#

I have been trying to make an HQ and LQ mirror toggle in UI in a way so that when I toggle one of them and then toggle the other one, the first one should disappear, so they dont clip through each other. But for some reason it doesn't work in UI toggle menu, one mirror starts glitching and clipping through another one instead of disappearing when the other one is toggled. It only works if I make a separate 3d object and make it a toggle instead of ui toggle script, any ideas why?

Screenshot_2025-01-12_211043.png Screenshot_2025-01-12_211021.png
#

I made one toggle for lq and one for hq in UI

tiny whale
#

so it won't do your switcheroo that you've scripted

still oxide
#

Do I have to use ui toolkit to make what I want to make

agile dragon
#

yea, i already noticed what I did wrong, thanks anyway! xD

tiny whale
deep dock
#

tbh i don’t even know what UI Toolkit does, or even is

#

i only know about it’s existence

#

so you definitely do not need it for anything UI

#

afaik it can help you though

glass iron
#

I just don't think we can even use it in VRChat though?

deep dock
#

huh

#

interesting

polar wolf
deep dock
#

how does the left look compared to the right? and do the icons make sense? also, i'm not sure if the reset buttons have a good place on the left-side UI, but i like it better so i'm not sure what to do about those

image.png
jaunty walrus
toxic scaffold
#

I am new to making world's and I have just got this to happen and I don't know what to do.

Screenshot_2025-01-13_183342.png
tiny whale
toxic scaffold
#

none of this makes any sense to me

#

well I "fix" it

#

XD

#

Mb

deep dock
#

you’d just have to use a Raycast

#

there’s no built in function for that

#

Bobystar made that prefab, which actually gives you a function to get the raycast of your UI pointer

#

and, the reason you’d want to use his prefab instead of casting your own ray, is because he includes an offset and motion smoothing for his calculations, like the actual VRC pointer does

#

if you just use that prefab it basically does all the work for you.

#

you can use GetPointerRay to access it

deep dock
#

i don’t think that’s a prefab, it’s probably custom made in each world

void moth
#

Having a issue with the ui in VR mostly whenever you get ur controller near it it just highlights the whole canvas and also sliders interfering with other sliders that are near each other when ur clearly pointing at one as u can see in the video a few times happens in vr too

swift adder
# void moth

Sliders interfering with each other is probably the text, or some child object of each slider that's taller than the slider itself. You can uncheck "raycast target" on text or images to make them non-clickable. Or there's "raycast padding" to adjust the size of the touch area. (green box in the screenshot)

Screenshot_2025-01-24_104213.png
#

I'm not sure about the highlighting the whole canvas issue. It sounds like some object with Interact event, outside a Canvas

fair cargo
shrewd girder
#

how do I make the text not see through the whole map?

image.png
void moth
fair cargo
void moth
# fair cargo It shouldn't

well im trying to get rid of the highlight of the canvas when i put my controller near the canvas in vr

#

this is my canvas

void moth
fair cargo
#

For the highlights, I don't see what you mean...

#

Can you send a screenshot of the phenomenon

void moth
#

yea

#

leme see i can

#

it shows the highlight like if ur able to pick it up

fair cargo
#

(Do turn off navigation anyways, as the behavior is not set up properly in VRChat anyways)

void moth
#

thank you

fair cargo
#

So you get the pickup rim glow that vrchat does to objects

#

The "Interaction" glow

void moth
#

yes

fair cargo
#

The only reason that should be happening is if an UdonBehavior contains an OnInteract call, or something is marked with a VRCPickup

#

Note that the object also must contain a collider, as that is what VRChat uses to generate the rimglow

void moth
fair cargo
void moth
#

i think it has to have a box collider

fair cargo
#

Your check owner script is the issue

#

Can you send that script here

void moth
fair cargo
#

Did you write this?

void moth
#

my friend did

fair cargo
#

They used Interact incorrectly

#

That is only called for interactive objects that are not UI based

#

Ala the cube that toggles a mirror or something of the like

void moth
#

ohhh so thats why its highlighting

fair cargo
#

Yeah

void moth
#

oh my my my

fair cargo
#

Is there a way you add to the verifiedUsers[] in game?

void moth
#

we have that

fair cargo
#

Or do you set them in the inspector and only the inspector

#

Ah you guys have a website?

#

Or disbridge?

void moth
#

its a txt

fair cargo
#

Or something of the like

#

Yeah

#

Okay

#

So, don't do anything like that in interact

void moth
#

what would u do

fair cargo
#

I would set the interface to be disabled on Start(), and then AFTER OnStringLoadSuccess() will I re-enable the buttons for verified players

#

Using Interact like it is causes that glow

void moth
#

thank you ill have to talk with them once they get up

#

haha

#

doing the ui can be difficult i think i never done it before

fair cargo
#

It is fun too

#

Like making amazing UX/UI

fair cargo
#

I made a system that granted players access to objects via an api

#

So I add and remove them just by looking up their username, and let the api do the rest

void moth
#

i wanna add graphics into mine soon

visual stone
fair cargo
visual stone
#

yeh in the instance

#

it just. resets

fair cargo
#

You can set it manually

#

As a workaround for the time being

visual stone
#

that's what I was doing

#

I had to unpack the prefab in order for it to stop resetting

fair cargo
#

The beauty of CustomInspector <3

visual stone
#

T-T

#

teach me

fair cargo
#

Wrap any and all code to be ignored by UdonCompiler

#

If you choose to go a seperate file route, ensure there is no attached Udon Assembly Asset

true thicket
alpine socket
#

I have a world interaction where you can set two target coordinates, on basically an 6 x 80 grid. I can only think of making a huge grid that lets you click a point and assign it to either value, or like, two sets of Letter-Tens-Ones selector reels.

#

Are there any other ideas on how to do this?

alpine socket
#

Does standard unity UI drag and drop element functions work, or is there something VRC specific? Does drag and drop UI even work?

unborn maple
#

Who you guys recommending to watch to learn coding?

hearty copper
exotic quarry
#

How do I make an event triggered in udon graph when my pointer hovers over a UI button?

carmine panther
#

Maybe it works by itself, i dont know

alpine socket
#

Is there a prefab or system to allow In-UI drag and drop elements?

polar wolf
alpine socket
#

Bummer

fair cargo
scenic egret
#

I don't think so

swift adder
#

I've used them before. I know rich text has to be checked and the sprite asset has to be added to the text. But I assume you already have that or it wouldn't show in editor. Hm

Screenshot_2025-02-02_211107.png
#

Maybe it has to be written <sprite name="1"> instead of <sprite=1>?

#

Oh apparently you can also do <sprite index=1> so that might be the one you want. Not sure if 1 is the name or index in your sprite atlas

scenic egret
#

Ah neat I didn't know they added support for referencing the asset directly

#

It used to have be in a Resources folder before to be recognized

#

Maybe then

exotic quarry
#

Do TextMeshPro Sprites not work on VRChat?

#

Because, if I put in <sprite=0> it shows in the editor but in VRChat it just shows as the <sprite=0> thing

tiny whale
#

try Vavassor's suggestion of using <sprite index=1> and see if that does something

exotic quarry
#

Do I have to set the sprite asset somewhere else? I have it set in Project Settings under TMP

#

if sprites genuinely don't work in vrc like.. 8 of my other systems would be completely fucked.

#

Okay we're good. You can use global project settings, you have to put it on the actual component.

exotic quarry
#

Okay.. It's finally time, I really need to fix this. It works for me because I know where to press, but its not gonna work for anyone else. before its asked, no, its NOT the button size, that is completely correct. So.. what could the issue be? I have to press in VERY specific location to trigger these.

swift adder
alpine socket
# fair cargo You wanting like windows?

The ability to point at a button/element in a UI panel, hold down click to grab that element, and drag it to a different button/element in order to get context info from it

tiny whale
#

sounds neat but I don't think anyone has done it before, would have to be custom m ade

glass iron
#

Does OnPointerEnter work properly? From what I remember it doesn't on desktop unless you press tab or something.

I wonder how else one would do custom things like that. 🤔

errant compass
#

You might need to do something else w/ Raycasts or like how you can open a door in prison escape while holding something on desktop (my initial thoughts, prob wrong)

upper tree
#

I'm designing mobile UI for my VRChat world and I was wondering if there was some sort of safe zone feature to auto-adjust the position of my HUD so it doesn't overlap with the game's controls

fair cargo
#

From there, use the raycast math from that, and attach the UI Shape to the hit position

#

And janjan, you got yourself dragging windows!

#

Funnily enough, I implemented this in one of my other projects lmaooo

fair cargo
#

Yeah

#

I did

polar wolf
#

Found this prefab on booth, it's surprisingly good, base prefab is free then they sell module packs as add-ons, but if anyone just wants a simple UI base it's really nice

https://booth.pm/en/items/6248278

ワールド統合メニュー (World Integrated Menu) 【VRChatワールドギミック】 - yukineko work...

ワールド統合メニュー (World Integrated Menu / WIM) はVRChat用のワールドギミックです。 「ワールドによくある機能をひとまとめに、簡単に導入出来る」ことを目標として開発しました。 VPMからの導入にも対応しています。 https://vpm.yukineko.dev ◆ サンプルワールド このギミック本体と、現在公開されている全ての拡張モジュールの動作を確認することができます。 https://vrchat.com/home/launch?worldId=wrld_5d12971f-e010-4792-a06a-91342d0e6fc2

#

Has world/hand menu support out of the box too

#

As well as translations

#

Kinda insane value lol

#

Even has persistence support

frail shuttle
#

Neat. I made something similar for my world world years ago. Woulda been nice to have lol

icy coral
#

Trying to find a simple button that when the player clicks on it it opens a link 😭

tiny whale
icy coral
#

😭 ok thank you

errant compass
#

You can put links in the copy tho

#

Or your group link

polar wolf
#

I have superglued the ui to the player menu :3

20250213185245_1.jpg
tiny whale
#

love worlds that do this
what's the method of achieving this?

polar wolf
#

Also toggles and buttons are broken due to jitter on scroll rects so I'm using an incredibly hacky method to make them functional

#

But yeahhh, vrc really makes it hard to mess with the menu in general lol

swift adder
#

I kinda started preferring tabs or pages instead of scroll views. Because you can't use sticks or mouse wheel to scroll them. And other clunky stuff like that

polar wolf
#

You can use the mouse wheel, just need to listen for the events

swift adder
#

Doesn't it not work when scroll sensitivity is zero to prevent WASD key movement?

#

I haven't actually tried

polar wolf
#

Don't know, I manually handled it

errant compass
#

yeah WASD won't trigger the scroll if u have the sens to 0

versed robin
last lake
#

I need help with trying to get public class elements to show up here.. that Chat UI Controller is a test script.. and nothing is showing up for public classes so i can get the minimessenger to communicate with itself in the canvas.. and yeah its not showing the public class elements

polar wolf
# last lake

They need to be udonbehaviours or they get stripped on build

last lake
last lake
#

but for udon?

#

and it didnt work

#

..

tiny whale
#

lmao

#

don't ask ChatGPT for anything Udon related

#

it literally does not know

robust sluice
#

just don't use AI in general for coding lol. it will always fail

frail shuttle
#

Not always. I've used workik.com to great success for debugging. Used it to debug a complex issue with a script of mine that was 900+ lines and it fixed the issue and it worked without error despite me trying to debug the issue for days.

last lake
#

so i managed to actually get the public ui elements to work.. but now the program asset is not syncing up nor being created appropriately with the event system that now works.. and chat gpt is in a loop... i just got these messages...

hearty copper
oblique plover
#

UI, using the actual buttons and inputfield objects is such a pain.
I don't know why every time they just don't respond or at very specific angles (desktop mode) but I can't get used to them...At this point it's Unity tutorials I should search not even VRchat related...

Worst art is half of time when I look at a prefab, said prefab works but when I try to remake the button 1:1 mine don't. And I never figured out what is wrong with the very basics of this...Sorry, little random rant because I'm losing a whole afternoon on an inputfield.

errant compass
#

I've had some weird experiences with UI but I never have had that much of a difficulty...

#

The only thing that took me a minute to understand was the scaling

oblique plover
#

you mean how the white frame always start super huge?

#

or just scaling in general? I wonder if that's a problem like this that mess with the interaction detection on my side...

errant compass
#

yeah, how you gotta scale the canvas down to 0.01

oblique plover
#

guess I'll download the thing Haxi shared earlier and study it...It's almost 5pm I literally lost my afternoon on this

polar wolf
oblique plover
#

considering what I try to learn is why my buttons don't react to being pressed...I'm hopefully not looking into the complicated part xD

#

but I still don't understand why the cursor becomes the arrow on their stuff and not my buttons. it's like it's completely ignored

tiny whale
#

If you have a canvas that does not make the VRChat pointer show up:

The canvas must have a VRC_UIShape component on it. Make sure that you didn't place it on some other child object.
The layer of the Canvas cannot be UI. Setting the canvas and all it's children to default will work.
The object with the VRC_UIShape must have a box collider. If there is none, one will be added automatically after the world is uploaded. However if you have added a collider yourself, you must make sure that it is the correct size.
Make sure you do not have some other collider blocking the canvas.
#

these four at the top will be configured correctly

image.png
oblique plover
#

I spawned the VRC ones yes

#

"VRC_UIShape component" ok probably that then..

errant compass
#

Yeah that part too

#

I got stuck on scaling and always remembers to use that component

tiny whale
#

you should see it work in ClientSim

oblique plover
#

oh wait the parent have to have the box? not the button itself? or one canvas per button?

errant compass
#

The UI shape is only needed on the canvas

oblique plover
#

not the UIshape, it's already there

#

the box collider

#

Ok I think I see what I'm doing wrong...

#

I'm too used to not care about the canvas when I used to do box collider + udonbehavior...

tiny whale
#

it technically does but the collider will automatically be added on play/upload

oblique plover
#

so for actual buttons they need to stay inside that box

tiny whale
#

they need to be a child of the canvas, and yeah they need to be inside the area of the canvas (the Rect Transform)

oblique plover
#

honestly I need to relearn the workflow, I'm too used to just cheat only keeping the visuals on those

#

oh....

#

so that's really all that was...

#

that also explain why it only worked only on a precise spot earlier today... (accientally rotated the button, not whole canvas 🤣 )

#

ok, well that should make my life way easier then

errant compass
oblique plover
#

thanks again for the help, there's...really a different mindset to get in the right workflow for each thing there xD

errant compass
#

yeah and it doesnt help vrchat does things a bit diff

#

It took me a few weeks to really get the UI stuff down pat (i was not using my resources properly)

oblique plover
#

having to select a specific version of the object isn't a problem, but yeah thinking in actual 2D instead of moving the buttons wherever just because they arn't masked will need a bit of constraint xD

#

I'm too used to kill the problem using graphs on box colliders

grave dune
deep dock
#

i love interpolation animations

grave cloak
#

So, Im Wanting To Create A UI Button That Makes It So That When A User Clicks It, The Button Will Take Them To A Predetermined Link For Things Such As: Discord / Group/Websites

jovial heart
oblique plover
#

There is actually a prefab ment to link stuff as credits, but you could use it to link other stuff or study how it works.
It's close to what Zerithax is describing

#

https://booth.pm/en/items/3775671
https://booth.pm/en/items/5785395

Asset List Maker【アセットリスト自動生成ツール】 - ziston Shop - BOOTH

VRChatのワールド制作用の、使用しているアセットのリストを生成するツールです。 使用したアセットのURLを記入したテキストファイルからアセットリストを生成できます。アセット名はURLから自動取得します。 URLをクリックするとキーボードが表示されてコピーができます。 アセットリストが長くなってもスクロールができます。 VCCのSDK3.7.0以降のみ対応

[VRChat] AssetsListGenerater - アセットリスト作成サポートツール - aki_lua87's Lab -...

VRChatのワールドで利用する想定の利用アセットリスト一覧作成ツールです。 Inspectorからリスト形式で入力し、スクロール可能なリストを生成します。 URL入力部分はInputFieldなのでVRでもコピペしやすいかと思います。

#

Looks like I have two of them in my favs (both free, one just have a support/donation option), pick your poison xD

grave cloak
oblique plover
#

Arn't those interactions part of creator economy?

grave cloak
#

They Where There Before The Creator Economy

oblique plover
#

the best would be to contact the author of that world about it, then

#

You could still use the prefabs I linked as placeholder while searching for another solution I guess

jovial heart
#

Normal creators cannot do that

grave cloak
#

What?

#

Thats Some BS

oblique plover
#

oh well this explains that... xD

jovial heart
#

Yeah it used to be restricted to VKET only

grave cloak
#

What Is VKET?

jovial heart
#

Idk how the boxing guy got access to it unless it’s like a closed beta

oblique plover
#

How comes it's even avaiable to other things than event venues tho..?

jovial heart
#

The giant virtual market that’s filled with booths that sell avatar props and stuff like tbat

scenic egret
#

It's kind of like a partnered content creator only thing for events or if you're part of the VRC inner circle, regular developers can only open up a group page with Store.OpenGroupPage("grp_00000000-0000-0000-0000-000000000000")

jovial heart
#

So I need to add this system to my game but I’m a bit confused on how to do what I want exactly…

#

I need a list of players in the instance, but each player name is a toggle. When you click a different button, the currently toggled player is removed from that list and added to a separate one.

#

Im not sure if that’s easily accomplished with the existing UI toggle or if I should make my own toggle script, I guess

oblique plover
#

Or at least that's be similar to that prefab

frank swan
#

how would i make like a radar thing'

carmine panther
frank swan
errant compass
#

There is a radar example in the example central. If I recall correctly, there is an error in it... I believe Legos resolved it a bit ago.

#

But you would probably wanna use PlayerObjects. If you don't have programming experience, it'll probably be a little tough for your first swing

tiny whale
# frank swan how would i make like a radar thing'

yep check out a "Minimap" example from example central. And as Sondly says it does a have a little bug in it that's easy to fix, but it's a bit older and with the introduction of PlayerObjects, it may be easier to give it a go to make it yourself, maybe based off of the example. Depends on what you want and your schkill level

frank swan
tiny whale
#

Well the only way you'll make a radar thing is to make it :)

frank swan
frank swan
tiny whale
#

I'll see if I can find some decent tutorials

#

I assume you've already got the VRChat Creator Companion, Unity, maybe even a world project already set up?

frank swan
#

i dont know where to start

#

and i dont want to learn anything without knowing how it wil help me

tiny whale
#

well if you like videos: I followed Vowgan's tutorials back in the day. Some are outdated by now but he's edited the videos to say so and link to his newer stuff:
https://www.youtube.com/watch?v=GWv3zloRWY4&list=PLwEtUGCdQX7HMkFCVxiNvO4DS2CmHWbe6
But on top of this I have a background of years of coding, so I don't know how effective the tutorials will be for a complete beginner. YMMV.
If you like reading: VRChat's docs have some pages that showcase the basics
https://creators.vrchat.com/worlds/examples/udon/

YouTube
Vowgan VR
OUTDATED - NEW VERSION IN DESCRIPTION

This video is antiquated! (Old and Crap) Here's the new video!
https://www.youtube.com/watch?v=ibDu0dCeUE8

This is a short tutorial on getting a simple button toggle working using Udon, the new VRChat scripting system. As an example, we're using it to toggle a mirror on and off. I've also included a segment on doing the same thing in UdonSharp,...

▶ Play video
Udon Basics | VRChat Creation

Very simple Udon programs in Udon Graph and UdonSharp.

#

The "Example Central" we talked about: you can access via the SDK

image.png
#

this lets you download some example projects and import them straight into your current project to play around with
These are good if you like to just pick apart stuff that's already made

image.png
#

there's also a ton of prefabs people have made of some more basic scripts that you could also pick apart

#

and wether you decide to use the Udon Graph or UdonSharp, I still recommend at least learning a little bit of C#, because the concepts and ideas will be necessary for coding in graph as well.
I like to read so my best source of C# basics is W3Schools
https://www.w3schools.com/cs/index.php

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

#

now I hear you saying, "and i dont want to learn anything without knowing how it wil help me". I like the enthusiasm but you'll want to get a good grasp of the basics before jumping into advanced stuff, or you'll just get frustrated in the future.

#

I promise that anything you'd learn from any of these links, will help you achieve what you're trying to do, and also aid us in assisting you create what you want if you request help with your code

oblique plover
carmine panther
#

can confirm, udon is just an interface for unity, and unity is an interface for c# (?), and these interface are not perfectly made and sometimes you see weird bugs that cannot be explained by the interface itself, in which case you need to look at underneath to understand what is really going on, or what it is actually doing under the hood

#

and udon graph is just an interface for udon

#

not that i know anything about coding

tiny whale
#

how deep does the rabbit hole go

#

udon graph -> udon assembly -> udon VM (running C#? idk) -> Unity -> Unity's C# -> actual C# -> assembly -> machine code

carmine panther
#

chatgpt suggestions->

tiny whale
#

chatgpy suggestions -> the garbage bin

carmine panther
#

google translate->

#

machine code->cpu firmware stuff(?)

tiny whale
#

-> the very small gnomes in your CPU that do the math

swift adder
tiny whale
#

ah microcode

#

I remember having to make a state machine with them to design a computer in college

swift adder
#

Of course you don't need to go anywhere near that deep most of the time haha. But yeah a bunch of languages translated into other languages

tiny whale
#

praise whoever invented the concept of abstraction

oblique plover
#

So there's a whole council of gnomes and their translators (assembly?) that don't even speak the same languages and decides if what you made works or not. No wonder it's buggy! 🤣

tiny whale
#

and that's where the term "bug" comes from. the gnomes eat bugs

jovial heart
#

Oh yeah, I ended up manually building the scripts to get it working, but I was able to set up that UI thing I asked about the other day 😊

exotic quarry
polar wolf
hazy crown
errant compass
hazy crown
exotic quarry
exotic quarry
tiny whale
#

hm does your world have occlusion culling?

exotic quarry
#

It was the background thing.

tiny whale
#

maybe need to bring your UI elements just a little bit in front of that

polar wolf
#

very likely

oblique plover
#

a bit on front if normal object
or check the display order in layer if you use a canvas

#

completely forgot to reply earlier ._.

worn pasture
#

Hi, good evening/day. I've seen in various VRChat places and maps that clicking on it opens the group profile in VRChat. How do I get it to show up on my map? Is there a pre-made one or how do you do that? Also, another thing that shows up is an "entry" and a link to something to copy and paste somewhere else, like when you click on a video producer, sorry for the inconvenience

oblique plover
#

For the group link it's quite recent, check example central for examples.

#

For actual "redirect on click" you need special permissions from VRchat. So far, only official event venues like Vket and a few select partner creators have access to it since it can quickly becomes a huge can of worms and scammer's dream... 🤣

hard hollow
#

I'm trying to find an efficient way of adding a book, with chapters and subchapters. I have the layout grid for all my buttons but it's getting to be too much at once. Is there a script I can write or something to handle the invocation of text? I'm trying to make a bible, to be specific. Thanks in advance for your help

oblique plover
#

Also, the bible just itself is huge...adding all the relevent jumps is...quite the task

hexed shuttle
#

If I have UI Sprite that has transparency, is it possible for the raycast not to collide with the Image if the pointer is on a transparent part of the image?

hard hollow
#

Thank you, @oblique plover

jovial heart
#

So as long as your collider comp on the canvas itself reaches your sprites, the raycast will work and they’ll be clickable

rigid vector
#

currently im trying to create an avatar menu to kinda just make it a bit easier to locate me and my friends avatars instead of just going through rows on avatars placed everywhere in the world. but my issue is i'm not sure why when i pressed one of my friends avatars (JellyJoy) it doesn't show up what's suppose to be on the toggle (Which is the avatar pedestal and the back button that appears after i press the friends avatar button again shown in the video) i really need some assistance with this as this is my first time with world stuff.

carmine panther
rigid vector
#

its not a script i just put some stuff together with the canvas and buttons. i could show the hierarchy and stuff

rigid vector
errant compass
#

What is on the Friends Buttons? The UdonBehaviour

rigid vector
errant compass
#

Inspector and graph

#

oh and hierarchy I guess

#

there is a lot of ways for this to break, gotta check em all

rigid vector
#

so it's just empty with a canvas and button on it

errant compass
#

Like all the buttons you have for your friends

#

Select one, show the inspector

#

We need to make sure it's wired correctly

rigid vector
grave dune
faint hedge
#

is there a better way to set up RGB sliders? after watching a few videos on sliders i managed to make this myself but it gets really dark if all 3 sliders are moved to far to the right and also after switching visuals it doesn't save the slider values and i have to click each one to activate it again attached with the video is the udon graph im using for the sliders along with the animations set up

image.png image.png
ashen gust
#

I just want to make sure I'm not going crazy. I swear ages ago for the VRC UI Shape component to work you needed a box collider for the UI to interact properly. I've got a published world from 2023 using this. However, re-reading the docs it looks like you don't need any colliders, VRC UI Shape component seems to handle collision already?

frail shuttle
ashen gust
tiny whale
#

IIRC it will add it automatically on upload

#

yep

The object with the VRC_UIShape must have a box collider. If there is none, one will be added automatically after the world is uploaded. However if you have added a collider yourself, you must make sure that it is the correct size.

tight furnace
grave dune
ashen gust
#

Think this belongs here...
VRC Input Field works with TextMeshPro
VRC URL Input Field Doesn't?

Currently making a UI Theme & I want my Inputs & URL Inputs to look the same but the old Text inputs look trash compared to TextMeshPro

carmine panther
#

should work, that is how video players get url

ashen gust
carmine panther
#

u added a text (legacy), that is wrong object, u can choose the other one

ashen gust
carmine panther
#

its under ui

#

hmmm u need to install textmeshpro if u dont have it

ashen gust
#

I'm already using this in my project

carmine panther
#

but sdk should come with it

ashen gust
#

text mesh pro is installed

carmine panther
#

ok then u must have it

#

add game object-> UI -> text?

#

text (textmeshpro) or something

ashen gust
#

Yep, added those to the prefab, I cannot select them for VRC URL Input Field

carmine panther
#

drag from heirarchiy?

ashen gust
#

doesn't work

carmine panther
#

try add game object -> UI -> input field or something i forgot the name

ashen gust
#

There is an Input Field TextMeshPro (VRC) option in the dropdown but nothing for VRC URL Input Field

carmine panther
#

yeah that is it

#

that is where u input text

ashen gust
carmine panther
#

i forgot exactly how it is done but u can just look at the SDK video player url bar

ashen gust
#

Going to live with Legacy Text at the moment and just make as similar as possible. ( Could probably write a script to sync legacy text to a textmeshpro element)

tulip canyon
#

Who recognize the problem where your UI buttons are suddenly empty after click Play for game mode? How can i fix this annoying behaviour of Unity editor?

#

I just found out i need correct function. Incorrect function will just erased.

west ibex
#

This might be an incredibly dumb question but how do I make UI's scale to fit the screen entirely on Quest standalone? I've been fighting this for hours, I can get it to do it fine on pc but whenever I test on my quest it's just a tiny little box- 😭 I'm using a screen space - camera ui. Is there any way to fit it exactly? I need it to be precise

errant compass
west ibex
errant compass
#

You don't use ScreenSpace for VRChat

#

Instead, you'll have to place the UI an amount away from the head

west ibex
errant compass
#

Also I believe screenspace is crap for Quest Performance? IDK.

I handle the drunk fx and UI based on the local players head

#

and then you can just fine tune it. The issue is you are now fighting a different issue. Different resolution sizes for diff monitors and headsets

#

So then you may wanna add a system to resize/position it

#

I read your stuff in Demonshop server. IDK if that is the way to go but it is working

#

¯_(ツ)_/¯

still oxide
#

Can someone help me how do I make it so people can put a image url in and it will show up I’m using it as bar menus ?

errant compass
still oxide
errant compass
#

Technically yes... Depends on how you implement it

grave dune
hearty copper
#

ooh that moves nicely

grave dune
hearty copper
#

yeah that looks great

deep dock
#

for a music player, how does this look?

image.png
zenith forge
#

In terms of text resolution, I feel that due to the variation of screen-res in VR, you'll want the play-time to be a bit more legible.

#

A quick general question. I mainly work with UMG in Unreal for UI.

What is the standard method for spawning a player in with an animated UI? I've read that Unity UI design is more about designing custom tween-components than Unreal is, which is fine. Just wondering how others would handle such a thing.

#

I'd like to have a little world-bumper before the player spawns that is either not tied to head-rotation, or smoothed.

grave dune
carmine panther
#

how many fps does it run?

grave dune
#

All of this is event based so when no one is using it the performance cost is close to nothing. Tabs etc that aren't currently shown aren't rendered as well and most things are batched together. Once you go into play mode or build & upload it all unity layout components are also removed so there is no overhead from using them.
Once you do switch between tabs, turn things on / off there are a few custom update loops running for the animations that's about it. I haven't noticed any performance difference on PC and so far also nothing on Quest.

#

So the TLDR:

  • if not actively interacting close to nothing
  • if actively interacting there is a slight overhead due to the animation update loops.
#

Things that are animated:

  • Selector (highlight behind the buttons)
    • position
    • size
    • corner radius
  • Buttons
    • Size
    • corner radius
    • text pos
    • icon pos
  • Tabs
    • position
#

If pressed 4 things happen:

  • Selector gets told what button to animate to
  • prev selected button gets told to animate into the unselected state
  • new selected button gets told to animate into the selected state
  • tabs switcher gets told what tab to switch to
#

(sometimes I feel like I care way too much about this stuff lol)

hearty copper
#

(I don't think this is "too much" at all)

carmine panther
#

oh so it runs every frame? the video doesnt look like full framerate

#

i thought it runs like 30 fps

buoyant rapids
#

Anyone wanna show a rookie the ropes??

#

XD

thin flame
#

youre gonna need to be more specific

jaunty walrus
buoyant rapids
#

I have not done so yet, but I just got Unity.

thin flame
buoyant rapids
#

ooof i think im in the wrong chat

#

no? idk

hearty copper
#

What is your goal?

buoyant rapids
#

I want to make my own worlds and avatars lol

#

Im a newbie

hearty copper
buoyant rapids
#

Thanks, I figured so much. 🙂

thin flame
#

though youll have to choose between worlds or avatars at first

deep dock
#

the volume slider will show up when you hover over the volume icon, it won't always be there

alpine socket
grave dune
# alpine socket Is there an update on each distinct element (ex. per button), each component (ex...

Each button has it's own animation controller as you can override the default for each button / element independently.
So when you press on a button 3 things independently start a custom update loop:

  1. the Selector
  2. the newly selected Button
  3. the previously selected Button

Originally the Selector UI script did the animation for all 3 but that caused a few problems when switching selection before it finished animating and didn't allow for per element overrides.

#

The performance impact of this is very minimal though, even on mobile or quest.

#

As usually you don't have more than 3 or 4 (if the button switches tabs) animation systems running at the same time.

#

None of these use the normal update method btw, they all have custom update loops that start and stop when needed.

alpine socket
#

Just confirming, the animation controller isn't like the animator controller for the unity system, it's like a U# script that contains the start/end/bezier curves of the motion?

grave dune
#

yes

#

There are 0 animation controllers for any of this.

alpine socket
#

Cool, I've had enough of trying to juggle animator states and params, that stuff never works correctly

grave dune
#

Yeahhhhh

#

This also allows for dynamically adding more things

alpine socket
#

Neat. Layout components are damn helpful.

grave dune
#

This is for example what the selector (thingy that moves around) does

image.png image.png
grave dune
alpine socket
#

Ah yes, I love how this is basically old-school js animation logic. No fixed update? RequestAnimationFrame();

grave dune
#

xD

#

I'm currently working on making custom editors for all of my scripts

image.png
alpine socket
#

You're syncing the states, but not the progress in animation, I assume? Someone late joins, everything lines up, but if they joined mid animation, it's already finished for them?

grave dune
#

If they late join it essentially tries the same flow as if the button was just pressed. Same thing goes for persistence

#

So if you have a quick eye you might see things moving into position for like 2 seconds lol

alpine socket
#

Ah, makes sense. I need to learn how to do inspector UI

grave dune
#

Pretty easy!

#

I followed this guide:
https://www.youtube.com/watch?v=eCIv4i_i9bE

YouTube
Sasquatch B Studios
Making a custom inspector using UI Builder (Easy) | Unity Tutorial

Show your Support & Get Exclusive Benefits on Patreon (Including Access to this tutorial Source Files + Code) - https://www.patreon.com/sasquatchbgames
Join our Discord Community! - https://discord.com/invite/aHjTSBz3jH

--
Editor scripting is FINALLY in a much, much nicer state thanks to UI Toolkit. Creating custom inspectors requires a lot les...

▶ Play video
alpine socket
#

I remember like a year ago someone showing off a UI they were working on, and I immediately thought "hey thats neat, I'm taking that"

grave dune
#

Not bad looking! I would personally make the parent elements (e.g. backgrounds) more rounded as well to fit the buttons better

alpine socket
#

Slightly rounder

image.png
#

Motion-summoned user menu, with weightless throw physics, and poofs into a particle cloud at max distance

#

Being grabable is fun with the FPS counter, since you can check in-world while running around

grave dune
#

nice!

#

I've so far only made stationary UIs

#

Well, they can move to different areas on a map but that's about it

alpine socket
#

I'm considering making the menus in playerObject, but only enabling the menu content if it's local, just so you can see other players access the menu

#

It's a tiny bit confusing if they just stare into the void

grave dune
#

hmmm

#

that is something you could do

#

but don't forget that there is a bit of an overhead of having to render everyones UI

hearty copper
#

I was considering this, but having the other players' thing be a static object without the full UI, so you know what someone is doing but don't actually see the whole UI

alpine socket
#

Yeah, that's what I mean. You, as local, only see that they opened the black menu canvas, but not the actual menu stuff

hearty copper
#

right

alpine socket
#

So it's only +1 canvas draw per additional player

#

The world makes out at like 250 setPasses anyway, it's not the worst

deep dock
#

i think i get more customization that way though

#

huh, so all of unity’s built-in scripts use that for their inspectors? that’s kinda cool

alpine socket
#

It's all css, which is fun

hearty copper
#

huh, I've never looked at this, that's really cool

errant compass
#

I talked about UI in unity with someone and they said it was CSS. I was wondering where it was

#

I gotta take a peak when I'm back into VR dev

jaunty walrus
errant compass
#

Oh shame

prime anchor
#

hellooo i've got a weird problem and could really use some help. i have a ui in my world that functions perfectly in playtest, but when i load into vrchat in vrpc mode, my cursor hovers in front of the canvas like it's looking at a huge invisible box collider. the buttons still work from this weird super-far-forward collider, though, so i don't know what's up or why it's doing that. my actual collider is correct and nothing is using the z-axis (i double checked), so i dont know why it's doing this

#

you can see what i mean here, it even seems to have an underside (pic 2)

VRChat_2025-05-03_13-13-58.598_3840x2160.png VRChat_2025-05-03_13-14-33.831_3840x2160.png
prime anchor
#

nvm. 12 hours after struggling with it i finally checked the biggest empty holding everything and it was misconfigured. my bad -_-

grave dune
desert mauve
#

Yoooo. Just started to create my own world and I'm following a tutorial to toggle music. I created a button (TMP) and added Udon Behavior but once I click on create new program, I get these error in console and I'm not sure why.

I used latest version of CC to create the project.

image.png
hearty copper
#

scroll up to the top to find the compile error

desert mauve
#

This is all the way up.

image.png
hearty copper
#

clear, see what persists?

desert mauve
#

The main thing I see is something is null but idk what to do about that? I've tried doing some searches but I haven't found anything that has helped. Might not be looking in the right place but at the same time, super new to all of this.

hearty copper
#

not really much more we could tell you from here, find the script that won't compile and fix it or remove it

#

it looks like you have a bunch of udon assets without scripts though, not sure what you did to cause that

desert mauve
#

This is a brand new project, there weren't any scripts to begin with

#

afaik

hearty copper
#

I'm just reading the error messages

desert mauve
#

This is the only thing in the project.

image.png
deep dock
desert mauve
deep dock
#

after you delete the U# script as i instructed, click on your button again, and right next to "Create New Program" should be a dropdown to choose a different asset type. select "Udon Graph Program Asset"

desert mauve
versed robin
noble oxide
#

how i can continue building the corner here ?

image.png
severe hamlet
#

anyone good with syncing UI's across clients to where players see an updated ui based on what another player does?

hearty copper
#

If you don't have too may UI elements, one way I've seen is to make a small script that you drop onto each UI element that'll auto-sync its value. The AudioLink controller does this, for example.

severe hamlet
#

gotcha, I'm trying to make a scoreboard and its not working well accross clients haha

jovial heart
#

I’ve built a control panel and layered a canvas over it with transparent buttons over the physical buttons, but I was wondering if I should still try and set up an actual physical button interaction to it as well… I’m a bit nervous that it’ll be a rabbit hole to get into e.e

#

My question is: would any of you see this and automatically expect to be able to push the buttons? Am I tricking players into trying to push the buttons? Because if that’s the case, I would hate for this to be a consistent disappointment for the players

jaunty walrus
jaunty walrus
placid hamlet
#

is there a way to animate UI image materials?

desert mauve
#

Is there any reason why this script wouldnt' work for a simple button to play/pause/stop an audio track?

image.png
#

I have the main script on an audio source:

image.png
#

And then I added the script to the onClick section to play the audio but it's not playing the audio:

image.png
desert mauve
#

How to get rid of Invoke button?

image.png
amber bison
#

remove the button to test run it?

jaunty walrus
jaunty walrus
desert mauve
desert mauve
hollow flicker
#

I've got a particular vrc UI shape that keeps modifying its collider on start and its causing stuff to break. what are causes for this and ways to prevent it?

#

In editor

image.png
#

and during runtime

image.png
desert mauve
jaunty walrus
jaunty walrus
#

All method calls (from one script to another) in Udon are the SendCustomEvent extern under the hood.

fathom zodiac
#

Uhhh, why does VRChat's supersampled UI shader seem to hate "Vertex Color Always In Gamma Space"?

#

It made all my UIs extremely brightly coloured...

desert mauve
#

Trying to use Grok to help build a music player and I'm getting stuck on this one part.

It says to do the following but in my graph, I don't see a way to connect from Start to the Get Program Variable?

Not even sure if I set this up right.

image.png image.png
placid hamlet
#

Feels like this should be simple to do, but I can't figure out how to make held button events

desert mauve
#

Grok is saying I need to get an Array Get node instead of Array GetValue but I do not see this listed:

image.png
thin flame
#

Its the only one with a flow intake (the white arrow)

desert mauve
frail shuttle
#

Grok, or various models. Might be able to help you with some specific things, but I wouldn't expect it to actually be able to reliably guide you.

If you're unable to make a music player yourself, why not use one of the multiple free prefabs already available? I get if you want to learn to do it yourself, but you're not really learning if you're just mindlessly following an AI.

desert mauve
#

and I want to use udon graph - the music player I bought uses C#

frail shuttle
#

Then I wouldn't use AI at all. It will not teach you anything realistically. Read documentation, and see how pre made assets are made.

If you're just following an AI's hallucination step for step, you won't really know why you're doing anything and won't learn, and it will obviously mislead you

thin flame
hearty copper
#

... you didn't? Huh.

desert mauve
#

I'm following a tutorial and for some reason, when I try to set the clip before going to the Play node, I get an error in the console but if I bypass the set clip and go straight from the debug log to Play, it works. What would stop it from playing the audio from this screenshot?

image.png image.png
frail shuttle
hearty copper
#

Good way to attract scammers

marble cedar
#

I would like to have some way to use my world's menus on-the-go

#

I also get really annoyed when I hold down on both sticks for half a second and a menu appears

#

any thoughts on a good way to do this?

#

It'll definitely be on a toggle

#

One world I was in had you grab with both triggers and pull apart, like you were stretching a rubber band

#

That was fun

#

I like the idea of a menu that appears when you raise your arm like you're checking your watch

swift adder
#

I watched folks struggle getting the one that stretches between your hands to appear/disappear. Also I made one that you grab like pulling out of a backpack, over your shoulder. And some people kept pulling it out when adjusting their headset or dancing. I think while filming or streaming, so they were pretty annoyed.

So movement gestures seem tricky and I'd probably just do triggers/sticks now. But for movements, checking your watch is pretty easy to explain and perform so that's good

marble cedar
#

i often wind up ripping at my hair when it try to reach over my shoulder

swift adder
#

yeah I have wayyy longer hair now. So I'd probably run into that if I replayed my old world lol

marble cedar
#

I want to make it hard to accidentally open the menu, even when doing a lot of dramatic movements and gestures

#

raising your arm and staring directly at your wrist for a second would probably do the trick there

swift adder
#

oh yea, maybe a timing threshold is the key

glass crown
#

kinda gave it a try just now, in this case i'm requiring gaze for 1s before it starts to appear and another 1s before it fully appears and is interactive, though i couldn't think of a good way to make it orient properly relative to the arm at all times, so i didn't try

#

i think in an ideal world the dot product check would be from the menu* to the head assuming you could get a good consistent position/rotation to place it at, so it'd work more like an overlay menu, but i'm not familiar enough with avi bones or tracking data to try to work that out quickly

marble cedar
#

this is what i have in mind

#

i should include the intense zoom effect

glass crown
#

like a screen space thing that scales up lol? i'm not really sure how you'd translate to vr

marble cedar
#

okay maybe I just have the pose in mind :p

#

I also like H3VR's menus -- you just flip your controller over and use your other hand to interact

polar wolf
#

Bolt it to the player menu :p

jovial heart
#

Side note for the triggers and sticks, clicking in sticks is annoying for some folks because if you do it too often you wear your sticks out and gain stick drift

#

My favorite solution to that is pulling the stick down, but that won’t work for left stick since it would move the player back

glass iron
# marble cedar i often wind up ripping at my hair when it try to reach over my shoulder

Really? I never had that issue personally even with longer hair. Maybe the trigger area was too small?
This is particularly relevant because I also want to do a custom UI right now.
And my idea was to use the shoulder grip to take it out. I feel like that's the most sensible and straight forward way to do it. It's very easy to teach that to players too.

glass crown
carmine panther
#

i guess it uses Input.GetKeyDown("escape") to detect menu being opened? idl

alpine socket
#

I have a decent one for the both-hands-grab-n-stretch

polar wolf
glass crown
light sequoia
#

хуй

buoyant cedar
#

so im trying to make a little menu for the world, this is what ive made so far, does anyone have any suggestions on how i can make it look more cyber/futuristic?

image.png
carmine panther
#

make the background black and make the text neon green or cyan or purple

deep dock
#

some cool drawn-looking UI i made

image.png
carmine panther
#

please point the two spotlights at the piece and lit it evenly top to bottom for my ocd
or consider three different spotlights centered for the three objects in here

#

it is cool but the lighting will take it to next level

deep dock
jaunty walrus
deep dock
#

dunno why that has no game audio, i heard it while clipping that.. Photos just sucks in windows 11 i guess

jaunty walrus
#

I love how stylized it is!

carmine panther
#

lol thank you, much better

weary patrol
carmine panther
#

i can only hear realistic mouse click sounds, maybe it is recording with your mic

deep dock
#

yeah for some reason it only included my mic audio, even though the original file had game audio too. trimming with Photos in windows 11 has been causing the audio to break for some reason

hearty copper
deep dock
#

thanks, yeah i thought it would be a good indicator that, if a slider is turned down all the way, it's the same as being disabled

#

plus, the player light slider is disabled by default, and the others aren't, so it helps the player to assume as such

hearty copper
#

totally - I hate how many worlds have toggles that you have no idea what the state is. Is blue on or is pink on?

#

Lots of creators are awful UX designers.

desert vale
#

Can anyone point me to some resources on how to achieve hover effects on buttons that work both in vr and desktop (with mouse/cursor in desktop and a typical laser in vr)? I cant find any definitive resource/examples for something that feels kind of trivial vrcSad

deep dock
#

normally you would use an EventTrigger component set to listen for OnPointerEnter and OnPointerExit, however it doesn’t work in-game, and it seems nobody else has a solution

desert vale
#

I think some people might achieve it with a raycast and colliders? If so though do they use Canvas still or avoid it entirely? (Not asking you directly but, if anyone comes along and has insight into that it'd be appreciated).

deep dock
#

i know Bobystar has a prefab system called Dual Laser, which implements the raycast with correct offsets for you. so theoretically you could use the raycast from that system to have the “on hover” effect

#

i may also just look around and find a world with a UI hover effect, and contact the creator to ask how they did it

fresh steeple
deep dock
#

i don’t know why, but the every event except the hover ones work

#

which is dumb, because that’s the only one i usually need from EventTrigger

fresh steeple
#

Strange.. The ones in green here are all the ones I was just able to trigger by spamming around the square

image.png
deep dock
#

and that world uses the EventTrigger component, right?

#

or is there another method to running those events

fresh steeple
#

Yep, it's driven by an EventTrigger

deep dock
#

yeah, that’s really weird. PointerEnter/Exit, in two separate projects, have worked in clientsim but not in-game for me. i even tried with and without an EventSystem, to no avail

fresh steeple
#

Hm.. This may be a tad obvious, so I aplogize, but you're certain they're calling public methods in your scripts, right?

deep dock
#

i haven’t opened those projects in a while, but i’m sure they were, i don’t usually make my methods private unless i know they can be

fresh steeple
#

Although if it's working in the editor then I suppose they must be 🤔

deep dock
#

yeah it always worked in clientsim

fresh steeple
#

Just checked the project file. The setup in my test world is dead simple: EventTrigger directly to public method (well, directly to SendCustomEvent for the public method) & it seems to work fine. 🤔

image.png image.png
deep dock
#

maybe i should look over it again.. as far as i remember, that’s all i did too

thin flame
#

Remind me in a few hours tho cauz rn im not home

deep dock
#

all i want to do is have a UI button do something when it's being hovered

deep dock
thin flame
#

Ping to remind me if it slips my mind

thin flame
#

@desert vale @deep dock here's how i have something happen "on ui hover"

image.png
deep dock
#

yeah that's the same thing Blue Cat was showing, an eventtrigger with PointerEnter and Exit, and the same thing that wasn't working for me

thin flame
#

oh woops i didnt notice

weary patrol
#

Not sure if anyone's asked yet, but do you have an event system in your scene?

#

It should get auto-generated but worth checking if you haven't already

deep dock
#

i already mentioned that i tried with and without adding an event system within unity

#

it's been a whil since i used eventtrigger, but i'll have to try again and test some more

deep dock
#

okay so it calls the event correctly in-game, but the rest of the code doesn't function???

image.png image.png image.png
deep dock
#

in-VRChat, i get the messages for Pre and Post twice for each event. meaning the thing gets toggled on and off in the same frame

image.png
#

so the issue is not that it doesn't work, it's that the event fires twice for absolutely no reason, breaking anything related to toggling a bool

#

that's nice.

deep dock
thin flame
#

should be pretty easy to patch it i think?

#

call -> to filter -> back to regular method

deep dock
#

i'm not sure how i would check, unless something like?:

private int eventCounter = 0;

public void _OnPointerEnter() {
  eventCounter += 1;
  if (eventCounter == 2) {
    _DoSomethingElse();
    eventCounter = 0;
  }
thin flame
#

wait a sec

#

no i misunderstood the whole thing i think?

thin flame
#

if thats the case, we can leverage SendCustomEventDelayedFrames to give it a cooldown of one frame

deep dock
#

yeah, according to the video i sent, it seems to be calling the event twice in the same frame

thin flame
#

then sec, lemme modify the code i just sent

thin flame
#

i use this cooldown with a delay concept with a lot of my own things, its very useful

deep dock
#

that sounds like it'll work

thin flame
fresh steeple
hazy crown
#

why it be stretchy like that

deep dock
#

the canvas should be a uniform scale, and to change the shape, you could only ever use the Height and Width

#

also, the scale of your canvas is really big. it should be 0.001, so the width and height are more like 100-1000

#

it generally makes more sense since canvases are usually measured in pixels (even though worldspace UI is different)

#

also, when the scale is too large, the collider the VRCUIShape gives it will cause the pointer to float in front of the UI

dense sigil
#

Anyone know what would cause a canvas to disappear? I am trying to use a scroll view and mask to only show a few objects on screen, but if the list has too many objects in it and goes too far off screen the whole thing vanishes. I cant seem to find the right search terms to find a fix

polar wolf
hazy crown
#

thx 🙂 one thing too is , why is Scroll view so jank ,it works slightly in vr but very clunky and bad , am i missing somethin ?

fallow iris
#

I'm so confused cuz I've made the Ui many times, but this is the first time I'm having an issue with. Apparently, there's a box that covers the Ui as you can see it in the first pic. I shot the particles at it to show that there's a block.
But in unity, the box collider is completely flat as seen in the second pic. I can press the toggle button just fine when on desktop, but when I'm on VR, I couldn't reach the button.

VRChat_2025-06-29_16-15-39.368_1920x1080.png image.png
polar wolf
hazy crown
fallow iris
thin flame
sharp flare
#

When i click in escape mode the buttons work, but when i click them with my crosshair they dont

sharp flare
#

fixed it by changing the layer from UI to DEFAULT

thin flame
#

Oh yeah that would be why

fallow iris
deep dock
# hazy crown there is no work around ?

yes, there is a workaround. add an Image component to the content, make it fill the entire content area, and place it behind all your actual content. then, make the color invisible, and make sure Raycast Target is enabled

#

you’ll then be clicking on that “image” whenever you click a deadzone, which will allow you to drag the scroll rect

#

i also tend to do this when i’m making a scroll rect for read-only content. instead of having each individual element use Raycast Target, i disable it on everything except one Image component which i place over everything else, that way you can drag to scroll when clicking anywhere inside the scrollable area

#

(UI elements are sorted back-front from their positions in the hierarchy, in case you didn’t know)