Skip to main content

Unreal Engine Module - Store game settings in the cloud - Options menu overview

Last updated on January 13, 2024

What's on the Options menu

In this tutorial section, you will learn the components available on the Byte Wars options menu. The Options menu provides a basic UI to change the music and SFX volume of the game. The Options menu is defined by several files below.

  • First, there is a C++ class called OptionsWidget. This is the class where the options menu functionalities are defined.

    • Header file can be found in /Source/AccelByteWars/Core/UI/MainMenu/HelpOptions/Options/OptionsWidget.h.
    • CPP file can be found in /Source/AccelByteWars/Core/UI/MainMenu/HelpOptions/Options/OptionsWidget.cpp.
  • Second, there is a widget Blueprint called W_Options which is created using Unreal Motion Graphics (UMG). Its parent class is the OptionsWidget class. You can find this Blueprint in /Content/ByteWars/UI/MainMenu/HelpOptions/Options/W_Options.uasset.

Alright, now let’s take a look at the W_Options. In the Unreal Editor, open the file, and you should see the game options like the image below.

Game options

As you can see from the image above, the Options menu has two simple sliders, to configure the music and SFX volumes, and a checkbox. Ignore this checkbox for now, as it is not related to this module. Here are the declarations of those sliders:

private:
UPROPERTY(BlueprintReadOnly, meta = (BindWidget, BlueprintProtected = true, AllowPrivateAccess = true))
UOptionListEntry_Scalar* W_OptionMusicVolumeScalar;

UPROPERTY(BlueprintReadOnly, meta = (BindWidget, BlueprintProtected = true, AllowPrivateAccess = true))
UOptionListEntry_Scalar* W_OptionSFXVolumeScalar;

To avoid modifying any core game classes, we have provided two delegates that will be triggered upon widget activation and deactivation. The OnOptionsWidgetActivated and OnOptionsWidgetDeactivated. You will be using this delegate to trigger your implementation in the next section.

public:
inline static FOnOptionsMenuActivated OnOptionsWidgetActivated;
inline static FOnOptionsMenuDeactivated OnOptionsWidgetDeactivated;

Ready the UI

When you follow this tutorial module, for the W_Options to work properly, you must complete the following steps.

  1. Build and open the Byte Wars project in Unreal Editor. Then, go to /Content/TutorialModules/Storage/CloudSaveEssentials/. There, you will find a data asset called DA_CloudSaveEssentials. Open it and enable the Is Starter Mode Active. Then, save the data asset.

    Data asset with starter mode active

  2. Congratulations! You are now ready to implement Cloud Save to store the game options.

Resources