Add match session browser menu - Browse dedicated server joinable sessions - (Unity module)

Last updated on November 25, 2024

What's on the menu​

A Unity user interface (UI) prefab for browsing match sessions has been prepared for you. You will use a starter version of this UI so you can follow along with this tutorial, adding code to it from scratch. The starter UI is available in the Resources section and consists of the following files:

  • BrowseMatchMenuCanvas_Starter.cs: A C# that contains most of the match session browsing implementation. This class connects UI and the AccelByte Gaming Services (AGS) Game SDK service wrapper class to call its API.
    • CS file: Assets/Resources/Modules/MatchSessionDS/Scripts/UI/BrowseMatchMenuCanvas_Starter.cs
  • BrowseMatchMenuCanvas_Starter.prefab: A GameObject prefab based on the Canvas Panel UI GameObject.
    • Prefab file: Assets/Resources/Modules/MatchSessionDS/Prefabs/BrowseMatchMenuCanvas_Starter.prefab

Browse match session canvas​

The prefab you will use to implement browsing match sessions is BrowseMatchMenuCanvas_Starter.prefab. The buttons and panels are already referenced in BrowseMatchMenuCanvas_Starter.cs. In BrowseMatchMenuCanvas_Starter class, the Start function will look like the code below. This codes is for UI setup, setting the buttons callback, and setting up event listeners. The last line in Start is for retrieving browsable match sessions.

private void Start()
{
    ...
    BindEvent();
    backButton.onClick.AddListener(MenuManager.Instance.OnBackPressed);
    refreshBtn.onClick.AddListener(BrowseMatchSession);
    scrollRect.onValueChanged.AddListener(OnScrollValueChanged);
    GameManager.OnDisconnectedInMainMenu += OnDisconnectedFromMainMenu;
    BrowseMatchSession();
}

The following image shows Here is the preview of the browse match session canvas. You will use it to display available game session entries.

Browsing joinable DS sessions in Unity Byte Wars

Match item canvas​

The list of match sessions is displayed using a prefab component named MatchSessionItem.prefab. This panel presents necessary information of sessions. The prefab leverages the MatchSessionItem.cs script to update the user interface with provided data.

Match items in DS sessions in Unity Byte Wars

Ready the UI​

In this section, you will learn how to implement UI functionality before calling the AGS Game SDK API to browse match sessions.

  1. Open BrowseMatchMenuCanvas_Starter and modify OnBrowseMatchSessionFinished to handle the data returned from the function to browse match sessions as shown below.

    private void OnBrowseMatchSessionFinished(BrowseMatchResult result)
    {
        // Filter game session results.
        result = new BrowseMatchResult
        (
            RegionPreferencesHelper.FilterEnabledRegionGameSession(result.Result.ToList()).ToArray(),
            result.ErrorMessage
        );

        if (string.IsNullOrEmpty(result.ErrorMessage))
        {
            HideLoadingBackToMainPanel();
            if (result.Result.Length<1)
            {
                noMatchFoundInfo.SetActive(true);
            }
            else
            {
                noMatchFoundInfo.SetActive(false);
                RenderResult(result.Result);
            }
        }
        else
        {
            ShowError(result.ErrorMessage);
        }
    }

  2. To handle the data retrieved from the next page of pagination, modify the OnNextPageMatchSessionsRetrieved function as shown below.

    private void OnNextPageMatchSessionsRetrieved(BrowseMatchResult nextPageResult)
    {
        if (string.IsNullOrEmpty(nextPageResult.ErrorMessage))
        {
            RenderResult(nextPageResult.Result, loadedModels.Count);
        }
        else
        {
            ShowError(nextPageResult.ErrorMessage);
        }
    }

  3. This step will differ depending on which module you are building from.

    1. If you are working from the Create Match Session Using DS module, open Assets/Resources/Modules/MatchSessionDS/MatchSessionWithDSAssetConfig.asset in the Unity Editor.
    2. If you are working from the Create Match Session Using P2P module, open Assets/Resources/Modules/MatchSessionP2P/MatchSessionWithP2PAssetConfig.asset. Select the AssetConfig file and tick the Is Starter Active checkbox. This will switch the script that's handling the UI from using BrowseMatchMenuCanvas to using BrowseMatchMenuCanvas_Starter.

  4. Play the game in the Editor. If your implementation was successful, when you navigate to the Browse Match Menu, you will see this log:

    [BrowseMatchMenuCanvas_Starter.cs] [BrowseMatchSession] [Log] [linenumber] - Browse Match Session not yet implemented

Resources​

Last updated on

On this page