Stats profile menu UI - Stat tracking and display - (Unity module)

Last updated on October 24, 2024

What's on the menu

In this tutorial, you will learn how to prepare the user interface (UI) to display statistic (stat) values. Later, this menu will display the highest score stat stored in the AccelByte Gaming Services (AGS) Admin Portal.

The Stats Profile Menu UI has been created for you, but it still needs some additional code before you can connect it with the AccelByte Gaming Services (AGS) Game SDK. These files are available in the Resources section and consist of the following files:

• StatsHandler_Starter.cs: a C# script that contains most of the stats implementation.
  • CS file: /Assets/Resources/Modules/StatsEssentials/Scripts/UI/StatsHandler_Starter.cs
• StatsProfileMenuCanvas_Starter.prefab: A GameObject prefab that was created from a Canvas Panel UI GameObject.
  • Prefab file: /Assets/Resources/Modules/StatsEssentials/Prefabs/StatsProfileMenuCanvas_Starter.prefab

The Stats Profile Menu only has a default state. This menu is only accessible from the Profile Menu and its menu button is already exposed in the Main Menu. See below for a more detailed explanation of the prepared UI.

Stats Profile Menu

The Stats Profile Menu will display player stats based on the query result from the AGS Statistics service. It contains Stats Items Texts, Stats Items Value Texts, and a Back Button that uses TextMeshPro for the Text UI.

The following code is the declaration for the UI references in StatsHandler_Starter.cs:

[SerializeField] private TMP_Text singlePlayerStatValueText;
[SerializeField] private TMP_Text eliminationStatValueText;
[SerializeField] private TMP_Text teamDeathmatchStatValueText;
[SerializeField] private Button backButton;

The function named OnBackButtonClicked() will listen to the backButton variable's onClick event and redirect the player to the previous menu with MenuManager. The following sets the listener for onClick event inside the Start() function:

void Start()
{
    backButton.onClick.AddListener(OnBackButtonClicked);
}

private void OnBackButtonClicked()
{
    MenuManager.Instance.OnBackPressed();
}

Here's the preview of the Stats Profile Menu:

Ready the UI

Here in this section, you will prepare the UI for the AGS Game SDK Statistics integration.

1. Open Byte Wars in Unity.

2. Open StatsHandler_Starter.cs.

3. Inside the Start() function, add OnBackButtonClicked() to listen to the back button's onClick event. Also, set the statistics value texts to the default value 0.

   void Start()
   {
       backButton.onClick.AddListener(OnBackButtonClicked);
   
       singlePlayerStatValueText.text = "0";
       eliminationStatValueText.text = "0";
       teamDeathmatchStatValueText.text = "0";
   }

4. Back in the Unity Editor, from the Project window, open the Assets/Resources/Modules/StatsEssentials/StatsEssentialsAssetConfig.asset and enable Is Starter Active to be able to use your starter setup.

   

Resources

• GitHub Link to the files in the Unity Byte Wars repository:
  • Assets/Resources/Modules/StatsEssentials/Scripts/UI/StatsHandler_Starter.cs
  • Assets/Resources/Modules/StatsEssentials/Prefabs/StatsProfileMenuCanvas_Starter.prefab