リーダーボードメニューの概要 - 毎週のリーダーボード - (Unity モジュール)
What's on the menu
In this tutorial, you will learn about the components available in Byte Wars for periodic leaderboards. Since a periodic leaderboard is part of the AccelByte Gaming Services (AGS) Leaderboard service, you will reuse all the Leaderboard Menu user interface (UI) from All time leaderboard.
As a reminder, these prepared files are available in the Resources section and consist of the following:
LeaderboardSelectionMenuCanvas_Starter
: A UI menu that displays all available leaderboard lists.- CS file:
/Assets/Resources/Modules/LeaderboardEssentials/Scripts/UI/LeaderboardSelectionMenu_Starter.cs
- Prefab file:
/Assets/Resources/Modules/LeaderboardEssentials/Prefabs/LeaderboardSelectionMenuCanvas_Starter.prefab
- CS file:
LeaderboardCycleMenuCanvas_Starter
: A UI menu that displays all available leaderboard period options.- CS file:
/Assets/Resources/Modules/LeaderboardEssentials/Scripts/UI/LeaderboardCycleMenu_Starter.cs
- Prefab file:
/Assets/Resources/Modules/LeaderboardEssentials/Prefabs/LeaderboardCycleMenuCanvas_Starter.prefab
- CS file:
LeaderboardMenuCanvas_Starter
: A UI menu that displays the ranking list of the chosen leaderboard.- CS file:
/Assets/Resources/Modules/LeaderboardEssentials/Scripts/UI/LeaderboardMenu_Starter.cs
- Prefab file:
/Assets/Resources/Modules/LeaderboardEssentials/Prefabs/LeaderboardMenuCanvas_Starter.prefab
- CS file:
RankingEntryPanel
: A UI component to hold the ranking information.- CS file:
/Assets/Resources/Modules/LeaderboardEssentials/Scripts/UI/Components/RankingEntryPanel.cs
- Prefab file:
/Assets/Resources/Modules/LeaderboardEssentials/Prefabs/Components/RankingEntryPanel.prefab
- CS file:
LeaderboardItemButton
: A UI component that is used for the leaderboard options button.- Prefab file:
/Assets/Resources/Modules/LeaderboardEssentials/Prefabs/Components/LeaderboardItemButton.prefab
- Prefab file:
Ready the UI
There are some changes needed for adding all Periodic Leaderboard UI, so you will need to add some functionalities in your starter scripts that handle the Leaderboard Cycle Menu and Leaderboard Menu UI.
Add event delegate in Leaderboard Cycle menu
Open
LeaderboardCycleMenu_Starter.cs
.Add the
Weekly
value in theLeaderboardCycleType
enum, so you can know which period type you are using since both use a different button.public enum LeaderboardCycleType
{
AllTime,
Weekly
}Add a delegate and event to get the Parent Transform and Button Prefab to generate the Period button, which will be invoked upon the Leaderboard Cycle Menu starting.
public delegate void LeaderboardCycleMenuDelegate(Transform leaderboardListPanel, GameObject leaderboardItemButtonPrefab);
public static event LeaderboardCycleMenuDelegate onLeaderboardCycleMenuActivated = delegate { };private void Start()
{
...
onLeaderboardCycleMenuActivated.Invoke(leaderboardListPanel, leaderboardItemButtonPrefab);
}
Add event delegates in Leaderboard menu
Open
LeaderboardMenu_Starter.cs
.Create a delegate to get the Leaderboard Menu Transform and the available Cycle Ranking.
public delegate void LeaderboardMenuDelegate(LeaderboardMenu_Starter leaderboardMenu, UserCycleRanking[] userCycleRankings = null);
Prepare some events to add additional processes for displaying the ranking list and user ranking.
public static event LeaderboardMenuDelegate onDisplayRankingListEvent = delegate { };
public static event LeaderboardMenuDelegate onDisplayUserRankingEvent = delegate { };Modify the
DisplayRankingList()
function to invoke theonDisplayRankingListEvent
event.private void DisplayRankingList()
{
...
onDisplayRankingListEvent.Invoke(this);
}
Enable starter mode
In the Unity Editor, open the
PeriodicLeaderboardEssentialsAssetConfig
in the Inspector. You can find this file inAssets/Resources/Modules/PeriodicLeaderboard/PeriodicLeaderboardEssentialsAssetConfig.asset
.In the Inspector, below the
Tutorial Module Starter
category, make sure theIs Starter Active
is ticked.
At this point, if you try to play the game, you will not see the periodic leaderboard button in the leaderboard cycle selection menu yet. This is expected and will be resolved later in this module.
Resources
- GitHub link to the files in the Unity Byte Wars repository:
- Assets/Resources/Modules/LeaderboardEssentials/Scripts/UI/LeaderboardSelectionMenu_Starter.cs
- Assets/Resources/Modules/LeaderboardEssentials/Prefabs/LeaderboardSelectionMenuCanvas_Starter.prefab
- Assets/Resources/Modules/LeaderboardEssentials/Scripts/UI/LeaderboardCycleMenu_Starter.cs
- Assets/Resources/Modules/LeaderboardEssentials/Prefabs/LeaderboardCycleMenuCanvas_Starter.prefab
- Assets/Resources/Modules/LeaderboardEssentials/Scripts/UI/LeaderboardMenu_Starter.cs
- Assets/Resources/Modules/LeaderboardEssentials/Prefabs/LeaderboardMenuCanvas_Starter.prefab
- Assets/Resources/Modules/LeaderboardEssentials/Scripts/UI/Components/RankingEntryPanel.cs
- Assets/Resources/Modules/LeaderboardEssentials/Prefabs/Components/RankingEntryPanel.prefab
- Assets/Resources/Modules/LeaderboardEssentials/Prefabs/Components/LeaderboardItemButton.prefab
- Assets/Resources/Modules/LeaderboardEssentials/LeaderboardEssentialsAssetConfig.asset