UMG reusable Styling

Hi,

I didn’t find anything on this topic for a while. The latest that I found is a answer hub question of October stating that this will be improved but not in 4.6. Can we expect somthing in 4.8 on this topic?

It’s really a constraint to not be able to reuse the styling accross widget and not be able to centralize the settings.

Is there any workaround by using Slate Style Asset that can do the trick until a final solution?

Thanks,

These already exist. You can create a new Slate Brush Asset in the content browser and use it anywhere.

Slate Brush Asset is not what I’m looking for or I miss a functionality. SBA is for me a way to setup texture/Material as Image/Border/Box.
I didn’t see that I can set them in a UMG Widget but that will be great.

I’m looking for defining a Button with all the states or defining a font style like: UIHeaderFont = FontName, FontSize etc… and be able to map the UIHeaderFont where ever I’m wanted to reuse it. And if I want to change to another fontsize, I will just do it once. More or less like a CSS in Webpage.

@TheJamsh,

I looked again in UMG and I wasn’t able to set the SlateBrush inside the UMG UI screen. Could you please give more information on how you are using them?

thanks,

its not in the umg screen just rght click in the content browser then ui under widget there is something named slate brush if i’m not mistaken

I have the same problem, has this been disabled? Is it no longer possible to set reusable Style in UMG? Button Widget Style [UMG] - UI - Epic Developer Community Forums
We still can create styles, but I can’t find where we can set them for certain buttons.

I’ve just been playing around with slate styles too the last few days and also came across this issue. For reference, the AnswerHub question mentioned in the original post is here.

I also came across a forum post (lost the link) where Nick mentioned that it should now be done on a widget level rather than a style level. So for example, you create a user widget in the designer to wrap whatever widget you want and configure its style properties. Then anywhere you want the widget, you use the user widget instead.

I can see that in some ways this approach is more flexible, but it’s also a lot less convenient than what was (apparently) available before, when all you want to do is quickly change some visual style across an entire UI.

Would be nice to know if there is any update on where Epic are going with this and when it is likely to happen.

The issue with wrap is that you are loosing all event on button.
By example, if you wrap a button and style it. Now when you reuse the button, you can’t add event “on click”. So this is not a styling solution.
I would really apreciate also a feedback on where we are with this in UMG.

Not so - your user widget can have any event it pleases. You could make your own OnClick event dispatcher, that you call when the internal button is clicked. All multicast delegates appear the same in the details panel. As far as any consumer is aware, it will look no different.

@Nick
Yes my answer was not complete but we need to create all event mappings, this is not “user friendly” compared to the previous styling method. I can get it as a workaround and it’s good to have it until a real solution.
For example on Text, you have also to reimplement the function like SetText and not just the event. It’s clearly a pain. You made a lot of things with smooth workflow for us, UMG has not reached this level yet ^^ May be we have now too high expectations.

Do you know what are the plan for this?

Thanks,

The plan is to come up with a plan.

I’m trying to follow this workflow with wrapping widgets, but the problem there is that default values set in construction script are not shown on UMG Editor (only in game). I’ve even made a new thread regarding this issue: Universal UMG widget parent for reuse - default variables preview? - Blueprint Visual Scripting - Unreal Engine Forums

@Nick,

Does something change on this? Have you move forward on the plan?

Thanks,

Nope, same state :slight_smile:

Thanks for the update ^^

by the way how are you doing this in Paragon ? Are you creating a lot of custom widget with all the customization that you need?
Are you creating C++ user widget with the Style variables?
I really want to get some best practices on how to setup a proper main menu hud. I bet Paragon main menu have a lot of thinks to handle and I have quite the same complexity to achieved, I’m wondering how to maintain the style accross the full app, in a manageble way.

Thanks

Both Unreal Tournament and Paragon use pure C++ Slate as far as I’m aware, not UMG.

Wasn’t UMG supposed to “replace” Slate completely? Instead I see the more complete projects (as the Shooter Game) using only Slate.

Even the docs for slate says that it’s the preferred method.

So, is Slate the preferred method for larger projects?

It’s not preferred as such, it’s just the underlying, C++ level implementation. So it gives you more control and better performance.

UMG wraps Slate and exposes the common stuff in a friendly way with a nice editor. I guess you could say it’s the Blueprint version of UE4 UI. I suppose it’s a bit more complex than that, in so far as Slate is independent of the UObject system, while UMG integrates the two. So in a way, UMG is a bit more than a blueprint wrapper. Still, it’s definitely not a replacement.

I agree, a video tutorial on this would be really good to see.

Yeah, I thought about it that way too. I just wanted to know if larger projects tend to use Slate because it’s faster or more productive (for the lack of styling in UMG).

For my projects I tend to make one item styled and “clone” its styling in blueprint. I think it would be really better to make a system where you could just create a style BP and drag’n drop it on a property inside the widget part. It would be kinda like CSS, allowing to choose a class and override specific attributes with inline.

UT is the only game using just Slate (and canvas for their HUD). Paragon’s frontend is mostly all UMG, the HUD is a mixture of Slate and UMG controls.

UMG is not meant to replace Slate. Shooter Game was created before UMG was a thing, this is true for most of the game samples.

Slate is the foundational UI tech UMG is built on. All the widgets UMG creates are Slate widgets. Under the hood it’s all Slate. The purpose of UMG is to make it simple for non-programmers to make a UI, and to do it with a lot more ease of iteration than is possible with Slate. Additionally Slate is not part of the UObject framework, which makes your life a lot harder when it comes to loading, and managing UObject resources to ensure they’re correctly reported to the garbage collector while being used. Lastly, Slate is terrible for making animations, to do that it’s best to use a visual designer.

Basically, what Kamrann said :slight_smile:

UMG is primarily the high level version of Slate, with a much friendlier face for most. However, sometimes, be it performance or lower level Slate rendering access, or a new kind of layout panel it’s best to write a new SWidget and then to wrap it in a UWidget to expose it to the designer to make it easy to use in UMG. e.g. some of the game teams (Fortnite) have made a custom button they use instead of the stock button in UMG. One that has a bunch of built in styles because they decided that there would be X kinds of buttons with a specific set of looks, so they made a button that lets you only pick a style from a dropdown matching their convention.