RFE: radio buttons

[ruigato]

Hello Lucas, amazing work with UberGui!

I know the architecture is to make an abstraction layer over the Custom Parameters of COMP's, and that the Radio button option is not available natively in TD Custom Pars, but.. what do you think? is it something we can hope for?

For what I see, the menu par type is a good candidate, it generates a list of buttons already in UberGui implementation. What would be nice is to have an option to render that list of buttons directly instead of being "inside" the menu

cheers, Rui

[EnviralDesign]

Hey @ruigato !

Thanks for your kind words, that is correct, layer of abstraction. However I actually see two other challenges with doing the radio buttons. Maybe you can provide some insight into one of them.

1) radio buttons with built in labels realistically cannot be too narrow, if you look at the parameters that are equiv of vec4, like RGBA the sliders and fields get quite cramped in a ui layout that is overall 300 pixels wide. so fitting radio buttons for say 3 or 4 might work, but more than that will probably get too cramped. I suppose they could wrap to next row, after a predefined number of radios (like td's max per row layout style) but then this causes this parameter type to be the only one that breaks the consistent row height styling. Could also maybe use horizontal overflow row, in css and scroll horizontally with the mouse wheel in that area, but then lacks visibility some. It's tricky! What did you envision, UX wise?

2) the other challenge is how this might cause the html to restructure. any change that changes how the html containers layout will need a big refactor in some other areas, so I've been working around things that would require that. It's possible, but not ideal.

[ruigato]

I see your point, my feedback in terms of UX is this:

the main reason to have radio buttons / momentary buttons displayed on a grid, is to be able to select options quickly when performing, with a zero level deep approach. The fact that to jump from option 1 to option 8, on a int slider, requires me to click on the slider and drag until I reach value 8, or on a pop up menu, to click on the menu expand button, scroll into the correct option and click again, makes those options second and third level deep, that steals precious time in a performance environment. So, my main references for this are the Jazzmutant Lemur and the Widgets (TD).

widgets example:

I understand that this will require the html containers to expand or contract dynamically, so it might be a change that is not possible! Also the one row per parameter approach might be a design option for Uber GUI that you want to keep, I can see that in terms of consistency.

In my experience, fast reach is a very important aspect in GUI for realtime apps :)

cheers

[EnviralDesign]

Hey! This is a really great point, I guess I haven't been thinking of UG in terms of realtime performances but I'd love to make it more robust for that too.

I have a framework already using the override dat to specify an alternate style mode or operational mode for specific parameters. I'll officially add this to my todo list but hard to say exactly when I'll get to it.

I guess along this line of thought, the color parameters might also be able to use an alternate style that renders inline, but that could potentially be even trickier.

refactoring/rethinking the way I parse the html into something that is less structure dependent prob needs to happen first, so changes like this are easier to implement.

[stevo-k]

Big +1 for the multiple items per row approach. Really hoping for extended possibilities like this (or the color inline feature you mentioned).

I love uberGUI for what it is but came across UI ideas where it required more flexibility per row items and I wasn't able to solve it with uberGUI.

Lucas, can you point me to an example where TD UI and UG UI are working side by side in a way that it's possible to use essentially one UG but in different places across the UI. To stay with the multiple toggles...

(upper section) UG controlled UI elements (center section) TD UI to realize e.g. multiple toggles in one row (lower section) Other UG controlled UI elements (somewhere else) Another UG UI e.g. floating or embedded in other TD UI elements

Thanks for your reply and for developing and sharing UG with us. Sven

[stevo-k]

one more thought...

Are there any plans to add custom images to UG? I mean especially for the VJ trigger buttons it's usual to display a thumbnail.

[EnviralDesign]

one more thought...

Are there any plans to add custom images to UG? I mean especially for the VJ trigger buttons it's usual to display a thumbnail.

Not currently a way to get images in, but it's technically possible with web sockets and some base64 image preloading via javascript.