1 min read

[15/50] A simple reusable alert widget in Unreal

Stable Diffusion result for: "An art of an alert box."
Stable Diffusion result for: "An art of an alert box."

A versatile alert widget can have multiple uses including notifying the user of empty states (when there is no content), as a pop-up to display one-off notifications and, when included with interactivity, as a confirmation dialogue.

Today we look at a simplified version of an alert widget we use. As usual, our workflow is: base definition and functionality in C++ and specific instances in Blueprints.

```c++
#pragma once

#include "CoreMinimal.h"
#include "CommonTextBlock.h"
#include "Blueprint/UserWidget.h"
#include "Components/Image.h"
#include "AlertBox.generated.h"

UCLASS()
class GAME_API UAlertBox : public UUserWidget
{
	GENERATED_BODY()

public:
	UPROPERTY(BlueprintReadWrite, meta=(BindWidget), Category="LostFerry")
	UImage* Image;

	UPROPERTY(BlueprintReadWrite, meta=(BindWidget), Category="LostFerry")
	UCommonTextBlock* Title;

	UPROPERTY(BlueprintReadWrite, meta=(BindWidget), Category="LostFerry")
	UCommonTextBlock* Description;

	UPROPERTY(EditAnywhere, BlueprintReadWrite, Category="LostFerry")
	FText TitleText;

	UPROPERTY(EditAnywhere, BlueprintReadWrite, Category="LostFerry")
	FText DescriptionText;

	UPROPERTY(EditAnywhere, BlueprintReadWrite, Category="LostFerry")
	TSoftObjectPtr<UMaterialInterface> ImageMaterial;

protected:
	virtual void NativeOnInitialized() override;
};
```

Our alert box contains a graphic or an icon to serve as a visual cue and a title with some description text with two UCommonTextBlock widgets and one UImage widget to render them.

#include "GameMenu/AlertBox.h"

void UAlertBox::NativeOnInitialized()
{
	Title->SetText(TitleText);
	Description->SetText(DescriptionText);
	Image->SetBrushFromSoftMaterial(ImageMaterial);
}

In the implementation, we simply assign the text, icon and the description to their respective widgets.