How do I make a Slate Widget Style?

Development Programming & Scripting C++
1

I’ve been looking up lots of resources on making Slate Widget Styles and they’re all 4years+ old and outdated, so I’m completely stuck now with Styles.

So whats the proper way to make Widget Styles now? Do you still need to make a Style Set? Widget Styles now have an initialize and destroy function.

Can someone give me a quick example how to set up a Widget Style now or tell me where I can find examples?
UE4 v4.19

2

Editor’s source code contains a mountain of samples you can study.

For in-game Slate they work pretty much the same;
But these days everyone(mostly) use a mix of C++ and UMG “UUserWidget” because it’s faster to design Widgets on UMG Editor while still have free C++ access to control the little important pieces through code.

3

I tried UMG but I prefer Slate. I also looked up built-in examples of Slate and examples from the Vehicle Game. The examples for the widgets themselves are good, but when it comes to Styles, it’s all over the place and I have no idea what I’m looking at.

4

I want to bump this. Is there any new development or resources available that shines the light on styles, re-usability, and slate? It feels like the wild wild west when developing a slate UI as the documentation or best practices are missing? I would be happy to write one once I get enough XP with unreal/slate.

5

Just stumbled upon this old thread while looking into a related topic and thought i might help anyone that finds this^^

  1. Create your Style class, it needs to inherit from FSlateWidgetStyle. Implement all the UPROPERTYs it needs. Best practice is to also use a decorator pattern for initializing the values later.
  2. You need to register a FSlateStyleSheet at module startup (and unregister it at shutdown) with the FSlateStyleRegistry. In the engine code this is done by having a singleton style class (such as FCoreStyle) create all your FSlateWidgetStyles and register them with the FSlateStyleSheet.
  3. You can now access the singleton style instance via the “Get()” function of your style, then look up the style sheet you need by its key.
  4. If you want to set the style at runtime, you need to create a UObject wrapper that can be used by the SetStyle function in UMG.

I recommend looking at CoreStyle.h/cpp and related source code for the details^^

3 Likes