In this tutorial, we’re going to cover creating notifications in Unreal Engine, similar to the “Lighting Build Completed” dialog boxes, or whenever Unreal asks something in the bottom right corner.
Here’s an example of what we’re going to be writing over the course of three parts, the top notification style is what we will be creating today, while the second will cover Hyperlinks and the third will require a bit more work to add buttons (restart/cancel).
If you’re here just for the code, know how it works but are forgetful like I am, a link to the Github repository that has all code for all three parts of this tutorial series is at the bottom of the Article.
I’ve divided up the code with comments for Part two and three, anything below each of these comments is for future parts.
Plugin and Widget Setup
Before we get started, I will assume a starting point of creating simple Unreal Engine plugin from the “Editor Standalone Window” template from the Plugin Browser and then following this guide on creating a Compound Widget. In this case, we will name the widget SNotificationsButtonsWidget as a class name.
With the only difference is we will have no Slate Argument, No Widget Name property and an empty Child Slot.
Anatomy of a Widget (C++ Unreal Engine)
So! For the sake of future tutorials I plan to write on Medium, I thought it be best to do a quick write up on creating…
So! Before we can actually start with notifications, we need to spawn our newly created widget within our main module window.
In the default template for Editor Standalone Window, our main Module’s cpp you’ll find an OnSpawnPluginTab() method. Most of what is here can be removed, the WidgetText at the top, and instead we replace the SNew(STextBlock) with our new widget!
So, let’s talk about notifications shall we? :3
Notifications in Unreal Engine are really simply handled. In Unreal Engine, there is a module that greatly simplifies the process of generating them — It’s called the FSlateNotificationManager.
It takes in a simple struct called FNotificationInfo which defines properties, like how long, what size and the message information that gets displayed. It can also be used for buttons and links — the second example in Part 2, will cover adding a link to the notifications too.
I’ll start by giving you the code for setting up the notification, and then I will go through and explain what’s going on!
Here’s our header file:
And here’s our CPP:
The first thing we do is preparing our button —
In our Construct’s child slot we just create a new button, with some text and place it in a Horizontal box. This just generates a new button and layout in our widget so we have something to trigger our notifcations with.
Last thing that is important is we define an FReply method. This is where our functionality for when our button is pressed, and is the delegate in OnClicked().
This is where most of our cool stuff happens! As I’ve said before, FNotificationInfo is a super nice struct that defines all of the behavior and text that appears within our notifications. We instantiate a new instance of a NotificationInfo struct, passing in a localized text string with our message.
There are a bunch of parameters you can use intellisense to check out, but here’s some of the basic ones.
Not all of these struct properties are just settings however, some we will see later like Hyperlink actually take in delegates. We’ll go over that soon.
The only thing left is the actual FSlateNotificationManager itself.
By most comparisons, FSlateNotificationManager is actually a relatively simple class within Unreal Engine. It’s main purpose is to just display information passed in by the struct and make a nice little thingy at the corner of your editor.
Checking out NotificationManager.h, you’ll find that it’s already well documented on it’s functionality in the comments, if you’re curious.
Here’s where you can find it:
In our case, we are getting a reference to the manager, and calling AddNotification() which simply generates a widget and what it calls a Notification Area for displaying a stack of notifications. It does some magic, but one thing to note — Notifications are done on the Game Thread, just something to be more aware of for those of you curious.
But to simplify:
Line 34 of our CPP: We call AddNotification on our Notification Manager and it displays our cool new notification.
Go ahead and compile, and let’s check it out. And yes, it’s highly spammable and fun to click — If you end up making a cookie clicker in Unreal Engine, let me know! XD
And for now, that’s it for part one. We will build on-top of this existing mini-plugin in part two and three, part two will cover Hyperlinks and changing iconography of our little notifications!
Here’s a link to the full examples for all three notification types (if you’re following along for this tutorial, comment out code under parts two and three.
GitHub - Sythenz/UnrealNotificationsExample: An example of creating custom notifications in Unreal…
An Example of creating custom notifications in Unreal Engine, similar to "Lighting Build Completed" boxes. This example…
It takes a lot to go through a lot of what slate has to offer Technical Artists and Tools Developers in Unreal Engine, and a lot of it is currently undocumented. If you’d like to support more of these tutorials going in depth into Slate and Unreal Engine tools development please consider my patreon ❤
Alessa "Codekitten" Baker is creating Unreal Engine Tutorials and Engine Plugins | Patreon
Hey friends! My name is Alessa Baker, I'm a Technical Artist working in the games industry, focusing on shaders and…
Thank you for reading,
Until next time,