Theme/Styles

[Querke]

Would it be possible to add some kind of styling / theme system? I guess it is hard to do it the same way unity uses stylesheets for UI elements.

But maybe something that sets same color, gradient, corner, border, shadow, padding/margin for UIBlocks based on the style chosen?

Maybe something like this:

[BlindsidedGames]

What a great idea.

[dkonik]

We wanted to give a quick follow up on this. We have spent some time creating a few prototypes of this feature, but unfortunately we haven't been able to land on something that we feel meets our standard for being useful and having a good user experience. We're going to continue to brainstorm on the right way to move forward with this feature, but for the time being I'm going to mark this as On Hold while we shift focus to other features and improvements.

[Querke]

This is the right approach. I am glad that you focus on quality in your product. Thanks for the update.

[najak3d]

This is needed majorly. For Fonts as well --- Size, Font Family, kerning, Color, etc... as though the settings for a TMP instance should be like a preset or prefab, and then you just select the "style" from a drop down. "None/Custom" means do your own settings.

Same thing for Margins/Padding - a drop down, with option "Custom/None" which then lets you do this on individual basis.

NOTE -- always show the values, and allow the user to tweak individual values, which will behave as override.

(this is how UI Toolkit does it, as more specific style settings can override less specific styles, and each style is then "sparsely populated" (Overrides only -- blank == use the less specific style, or the default).

This is the single-biggest feature missing from Nova UI which would allow modern UI designers to feel much more at-home using Nova UI, as well as to enable all of your users to have this type of expected power of easy styling/configuration.

Currently, to get things looking consistent involves a LOT of tedious checking of various settings in many places. The ability to edit a few re-used Styles - then immediately see the result for the entire UI -- is very much needed, and useful.

I'm confident you'll figure out something really sweet for this.

[najak3d]

We REALLY need this. It would put NOVA UI over-the-top, making 1st class UI.

As I'm tediously going through my UI elements to "make sure they are consistent" (very tedious slow and unreliable).

If you simply did something SIMPLE -- would be great:

1. List of Fonts - that we can name. Would include Color, Font, Size, Kerning, etc .
2. List of Colors

This would be immensely helpful.

Also, then we'd want these to be run-time adjustable, by modifying the Style run-time. So that the user can easily "choose a skin/theme" and we toggle between Light vs. Dark mode, etc... Or "Bigger Buttons/Fonts" (Enlarged Layout).

The current means for doing varied layouts is very deficient for realistic production-quality behavior (e.g. making UI adapt for various screen aspect-ratios, sizes, and user preferences).

For sizing - we need a way to specify the "min/max" as a dynamic equation, which involves both % and pixels -- which need to be scalable by a global scaling value. Being able to say "this panel needs to be:"

1. At least 20% of the Screen width
2. But not more than 500 pixels x Global Scaling Factor.
3. And never less than 250 pixels x Global Scaling Factor.

Right, now I'm making various Top-Bar's be 50 pixels high... but what if I decide 60 pixels is better (or the User wants it enlarged) -- or based upon DPI for a screen, it simply needs to be 40 pixels high -- I don't have any way to globally access these needs and make the adjustment.

We really really need "Styles / Color-Themes" and other means for adjusting sizes from a more centralized location.

I'm thinking NovaUI 3.0. If you need help with this, I might be able to assist (for free).

[ZanKievit]

This is a rather crucial feature to have for any UI system. Here's my idea for a design of this.

For a UIBlock I feel like it would work best to have a 'Style' for each category like a Position Style, Visuals Style, Border Style, etc.
With a 'Theme' as a merger of those Styles, with the choice of which style categories to include.
Where both are universally editable from an Editor window.

I feel like that makes for a very modular and approachable way of designing UI.
You could even have separate themes for layout, rendering, and effects if you want to get even more modular.

A quick and dirty in-editor mockup of how that could look like. (The menu buttons are for options to create/edit the styles)

You could extend that to work with a TextBlock as well.

For UIControls in general it gets a bit more complicated with the ItemView Visuals being user-made scripts and all. However, that should be possible with some modifications to the Visuals, probably involving reflection. For this specifically, you could maybe use Unity's Preset system where you exclude any reference fields from being applied.

[OrionFive]

I'd also like to chime in to say that this is the number one feature we're missing. It's a lot of work to create a consistent UI without it.