In this section, you'll learn how to create a custom title screen to show on the HUD Message device.
Follow these steps to create a custom title screen:
Create a Widget Blueprint with a User Widget variant named WBP_Title.
Add a Size Box widget first, then the Stack Box widget as its child. The Size Box gives a panel for the Stack Box widget to be positioned in.
Add an Overlay widget and a UEFN Text Block widget to the Stack Box as children.
Add an Image widget and a UEFN Text Block widget to the Overlay as children.
In the Details panel of the Stack Box widget, apply the following settings.
Option Value Explanation Padding
0.0, 0.0, 0.0, 200.0
This will add 200 pixel padding to the bottom of the widget.
Horizontal Alignment
Center Align Horizontally
This aligns the widget in the middle of the screen.
Vertical Alignment
Bottom Align Vertically
This aligns the widget to the bottom of the screen.
Orientation
Vertical
This stacks the widget's contents vertically.
In the Details panel of the Overlay widget, apply the following settings: Option Value Explanation Padding 0.0, 0.0, 0.0, 20.0 This will add a 20-pixel padding to the bottom of the widget. Horizontal Alignment Fill Horizontally The widget will take up as much space as it can. Vertical Alignment Fill Vertically The widget will take up as much space as it can.
In the Details panel of the Image widget that's a child of the Overlay widget, apply the following settings. Option Value Explanation Image T_AmberForestTown_Ceiling Set the image for the background of your title. Image Size X 620.0 Set the width of the background. Image Size Y 220.0 Set the height of the background.
In the Details panel of the UEFN Text Block widget that's a child of the Overlay widget, apply the following settings. Option Value Explanation Horizontal Alignment Center Align Horizontally This aligns the widget in the middle of the container. Vertical Alignment Center Align Vertically This aligns the widget in the middle of the container. Text Your Title Here Set the text for your title.
In the Details panel of the UEFN Text Block widget that's a child of the Stack Box widget, apply the following settings. Option Value Explanation Horizontal Alignment Center Align Horizontally This aligns the widget in the middle of the container. Vertical Alignment Center Align Vertically This aligns the widget in the middle of the container. Text Your Subtitle Here Set the text for your subtitle.
Save, then click Compile for the Widget Blueprint.
You'll add this custom widget to a HUD Message device later in step 5 of this tutorial.
