UMG Slate Widget Style

Sorry if this is in the wrong section, but I was unsure of which section to actually put it in.

The issue I have is that I am not sure how to use the Slate Widget Style asset. I’ve set it up, but I’m not sure how to apply the style to a button. I know you can do it manually, but the issue with this is that if you have multiple buttons and you want to change the style, you have to go to every single button and change its style individually. Obviously this isn’t efficient. It’s the same reason why you would use a cascading style sheet as opposed to manually styling each button in HTML.

I know in the older versions of Unreal Engine you had to use the Slate Widget Style asset which is probably the reason it exists in the first place, but now that you can specify the style manually for each widget, it seems that it can no longer be used.

I was wondering if it is still possible to use it and if not it would be a very useful feature to implement again in the future.

Can you post a picture of your setup if you have one?

And it’s in the correct section by the way.

~ Jason

I have a button style:

My question is how I use that style for my buttons as currently I have to do it manually like so:

The only thing I can think of is finding the default style in the engine files and changing it.

But, I’m not sure if that will work.

I think you may need to change each one.

I’d like someone to back that up though.

Let me know if you need anything else.

~ Jason

You can right click on Style (of the button) and click copy… then you can paste it to any other buttons, it’s even faster than widget styles if you think about it.

Hey there,

im not sure if i see this correctly but it seems you use simple buttons and define your style to each of those simple buttons.

Why not create a new Widget Blueprint consisting only with a button, assign your style to this button. And use your custom widget for your buttons in other widgets.
This way you only need to assign your style once and in f.e. a MenuWidgetBP instead of dragging a new button into your panel, you drag a “YourCustomButtonWidget” into your panel.

best regards

is right on that. If you are using the same style button more than once or twice, creating a button widget and placing it in is the best route. It does require a little more setup in the graph but in the end you’ll have a setup that is easy to change and update.

Not really. If you use the same style on multiple widgets throughout your application and then later decide to change something about them, you will have to manually edit each one individually.

As for making a widget, it does work, but what about events?

It would seem better for Epic Games to just implement a way of using the Slate Widget Style. You used to be able to use it, but they changed it.

hey, i dont know what should be the problem with events?

You can’t use button events if you create custom widget button. No events like this.

Tell me whether it is worth seek a solution to this problem?

I can assume that the developers do not know what the object-oriented programming. Confirming inappropriate differences between the UI objects and the actors of gaming space. The same garbage as in Unity. By the way, this Godot is not, but it is very buggy.

This is not a problem nor a bug or anything. It seems you misunderstood the event workflow a bit.

When i see your picture you added a custom Widget (btn) to a parent widget class (1234). Normally you wouldnt even expect the logic of your button inside an other class.
Ok maybe you came from C# and used windows form where you could “add” the button`s events inside a parent control. You can do this in similar way via Event Dispatcher.

I expect you want to have some logic in this 1234 Widget when your button was clicked. You would need to redirect to this “parent” widget inside the button widgets class “OnClick”.

With event dispatcher you would call an event inside the button class. And in this 1234 you would bind an event/function for the buttons event dispatcher.

An other way is working with the Widget Tree hierarchy. When you add your button to this panel here, your panel becomes a parent of that button. And inside the button you can retrieve the reference of its parent.

I know this is a bit late, but I stumbled upon this post because I had the same problem, maybe someone else wants a solution for this.

I found a solution by using make a data table.

First step is making a structure that will contain all the variables you need for your UI (eg. Button style, Slate font, slate color, etc)

You can add stuff to this later as you need them, don’t need to fill it out with everything right now.

After this you create a data table with your desired settings, you can even use this to make themes for your UI, by creating multiple rows with different styles.


The last step is putting it all together in your UI. For this you can either use the technique the guys mentioned earlier, creating a “button” blueprint and then adding it to your main UI blueprint, seems to be the best way once you get the hang of event dispatchers. Or doing it the old fashioned way, with everything in one place. For this you might need to make an array of all your buttons and apply the style to them.

Either way you use, I think it’s still helpful to have a centralized place where you can control the visual style of your UI.

You can hook it up in the event preconstruct, to be able to see your changes while designing the UI.

Hope this helps someone, at least until Epic makes a simple way to use the Slate Widget styles. I couldn’t find any way to use them with blueprints.

3 Likes

Recently, I’m same to tackle this case. I changed Engine source to solved it. You can add Set API for “DefaultButtonStyle” in Button.cpp,then add moudle to invoke the api to change default style.