Skip to main content

Adding UI - Playing with Friends - (Unity module)

Last updated on July 28, 2025

What's on the menu

This module adds two buttons to the existing menu using Byte Wars' built-in generated buttons.

Invite Friends button

A button to open the Friend menu from Friend Essentials module. The game generates this button into the Match Lobby menu on runtime. This button is defined by the following files:

  • InviteFriendsButton: A button to access friend list menu from the Match Lobby menu.
    • CS file: Assets/Resources/Modules/Play/PlayingWithFriends/Scripts/UI/InviteFriendsButton.cs
    • Prefab file: Assets/Resources/Modules/Play/PlayingWithFriends/Prefabs/InviteFriendsButton.prefab

Below is a preview of the buttons controlled by the InviteFriendsButton prefab:

Preview of the Invite Friends button

This button includes funtions tailored for Byte Wars integration.

  • Reference to the components that this button uses.
private Button button;
private CanvasGroup canvasGroup;
private void Awake()
{
button = GetComponent<Button>();
canvasGroup = GetComponent<CanvasGroup>();
// ...
}
  • Reference to friend module to retrieve the Friend menu to be opened.
private ModuleModel friendModule;
private void Awake()
{
// ...
friendModule = TutorialModuleManager.Instance.GetModule(TutorialType.FriendsEssentials);
}
  • An override function to only display this button when the player is currently in match and the match is a "Create Match".
private void OnEnable()
{
// Only show button if the current session is a "Create Match" session.
InGameMode gameMode = GameData.GameModeSo.InGameMode;
bool isMatchSession = gameMode == InGameMode.CreateMatchElimination || gameMode == InGameMode.CreateMatchTeamDeathmatch;
canvasGroup.alpha = isMatchSession ? 1.0f : 0.0f;
canvasGroup.interactable = isMatchSession;
canvasGroup.blocksRaycasts = isMatchSession;

// Skip button binding if the current match is not a match session.
if (!isMatchSession)
{
return;
}

button?.onClick?.AddListener(OpenFriendMenu);
}
  • A function to open the Friends menu.
private void OpenFriendMenu()
{
MenuManager.Instance.ChangeToMenu(friendModule.isStarterActive ? AssetEnum.FriendsMenu_Starter : AssetEnum.FriendsMenu);
}

Invite to Session button

A button to send the invite. The game generates this button into the Friend Details menu from Friend Essentials module on runtime. This button is defined by the following files:

  • InviteToSessionButton_Starter: A button to access friend list menu from the Match Lobby menu.
    • CS file: Assets/Resources/Modules/Play/PlayingWithFriends/Scripts/UI/InviteToSessionButton_Starter.cs
    • Prefab file: Assets/Resources/Modules/Play/PlayingWithFriends/Prefabs/InviteToSessionButton_Starter.prefab

Below is a preview of the buttons controlled by the InviteToSessionButton_Starter prefab:

Preview of the Invite to Session button

This prefab includes funtions tailored for Byte Wars integration.

  • Reference to the components that this button uses.
private Button button;
private CanvasGroup canvasGroup;
private void Awake()
{
// ...
canvasGroup = GetComponent<CanvasGroup>();
button = GetComponent<Button>();
}
  • Reference to the wrapper that you will set up later.
private PlayingWithFriendsWrapper_Starter playingWithFriendswrapper;
private void Awake()
{
playingWithFriendswrapper = TutorialModuleManager.Instance.GetModuleClass<PlayingWithFriendsWrapper_Starter>();
// ...
}
  • An override function to only display this button when the player is currently in match.
private void OnEnable()
{
// Only show if currently in game session.
bool isInGameSession = !GameData.ServerSessionID.IsNullOrEmpty();
canvasGroup.alpha = isInGameSession ? 1.0f : 0.0f;
canvasGroup.interactable = isInGameSession;
canvasGroup.blocksRaycasts = isInGameSession;

// Skip button binding if the current match is not a match session.
if (button == null)
{
return;
}

button?.onClick?.AddListener(InviteToSession);
}
  • A function to trigger the friend invitation, bound to the Invite to Session button. This function includes logic to retrieve the friend's ID. Since the generated button always appears in the Friend Details menu, it retrieves that menu instance directly. This function also includes code to access the PlayingWithFriendsWrapper_Starter, which you will modify later:
private void InviteToSession()
{
// Get target player's ID.
string targetPlayerId = "";
FriendDetailsMenu friendDetailsMenu = MenuManager.Instance.GetCurrentMenu() as FriendDetailsMenu;
FriendDetailsMenu_Starter friendDetailsMenu_Starter = MenuManager.Instance.GetCurrentMenu() as FriendDetailsMenu_Starter;
if (friendDetailsMenu != null)
{
targetPlayerId = friendDetailsMenu.UserId;
}
else if (friendDetailsMenu_Starter != null)
{
targetPlayerId = friendDetailsMenu_Starter.UserId;
}

if (targetPlayerId.IsNullOrEmpty())
{
BytewarsLogger.LogWarning("Current menu is not friend details or friend details starter menu.");
return;
}

// ...
}

Activate the starter mode

No UI modifications are required for this module. All necessary UI elements are already handled by the Byte Wars generated buttons. You only need to activate the starter mode.

  1. Build your project and open it in the Unity Editor.

  2. Open the Assets/Resources/Modules/Play/PlayingWithFriends/PlayingWithFriendsAssetConfig.asset file and check the Is Starter Active option.

  3. Play the game in the editor and go to Play Online > Create match > select any game mode > select any server type. Once you are in the match lobby, click the Invite Friends button and then select a friend entry. You will see the Invite to Session button. At this point, clicking the button will not trigger any action yet.

Resources