RobloxStudioでランキングボードを作成(Leaderboard)|Robloxゲーム作成メモ

RobloxStudioで「ランキングボード(Leaderboard)」を作成していきます。

はじめに

プレイヤーのポイント、レベルなどをランキングにしてボードに表示するのを作成していきます。「DataStoreService」を使用するので、下記記事の続きのような感じです。

制作開始

まずはシンプルなボードを作成していきます。「Part」から「Block」を追加してサイズを変更します。

追加したPartの名前を「Leaderboard_Coin」に変更。配下に「SurfaceGui」、「ScrollingFrame」、「UIListLayout」、「TextLabel」を下記のように追加します。

「TextLabel」がタイトル部分になるのでサイズとテキストを変更、「ScrollingFrame」にプレイヤーが一覧で表示されます。ポジションとサイズを変更します。

「ScrollingFrame」の配下に「Frame」を追加して名前を「Template」に変更。配下に「TextLabel」を3つ追加します。一人分の情報を格納します。

それぞれのTextLabelの名前を変更、色も少し変更を加えておきます。

これでボードの基本的なモデルが完成です。自分で作成するのではなく、フリーのモデルを利用する方法もあります。

ランキングを実装

ここから実際にランキングを作成していきます。今回はプレイヤーが保持しているコイン数をランキングにしていきます。

スクリプトの作成

いつもはServerScriptServiceに「Script」を追加、「Template」を配下ごとServerStorageに移動しますが、今回は「part」の配下に「Script」を追加、「Template」を移動します。

「Script」を作成していきますが、大きく3つの部分に分けて作成します。まずは「1.各プレイヤーのコイン情報をデータストアに格納」。

local Players = game:GetService("Players")
local DataStoreService = game:GetService("DataStoreService")
local CoinsDataStore = DataStoreService:GetOrderedDataStore("CoinDataStore")

function getAllPlayerCoins()
	for _, player in pairs(Players:GetPlayers()) do
		local coins = player.leaderstats.Coins.Value
		local success, err = pcall(function()
			CoinsDataStore:SetAsync(player.UserId, coins)
		end)
	end
end

「2.取得情報をラベルにセットしてランキングボードを作成」

local TemplateFrame = script:WaitForChild("Template")
local ScrollingFrame = script.Parent.SurfaceGui.ScrollingFrame

function CreateLeaderBoard()
	
	local success, err = pcall(function()
		
		local data = CoinsDataStore:GetSortedAsync(false,20)
		local currentPage = data:GetCurrentPage()
		print(currentPage)

		for rank,data in ipairs(currentPage) do

			local userId = data.key
			local userName = Players:GetNameFromUserIdAsync(userId)
			local coins = data.value

			if coins > 0 then
				local NewTemplateFrame = TemplateFrame:Clone()
				NewTemplateFrame.Label_rank.Text = "No." ..rank
				NewTemplateFrame.Label_name.Text = userName
				NewTemplateFrame.Label_coins.Text = coins

				NewTemplateFrame.Parent = ScrollingFrame
				NewTemplateFrame.Name = userName
			end
		end
	end)
end

「3.ランキングボードをクリア」になります。周期的にこの3つを実行してランキングボードを更新します。

local Players = game:GetService("Players")
local DataStoreService = game:GetService("DataStoreService")
local CoinsDataStore = DataStoreService:GetOrderedDataStore("CoinDataStore")

local TemplateFrame = script:WaitForChild("Template")
local ScrollingFrame = script.Parent.SurfaceGui.ScrollingFrame

function ClearLeaderBoard()
	for _, Frame in pairs(ScrollingFrame:GetChildren()) do
		if Frame:IsA("Frame") then
			Frame:Destroy()
		end
	end
end

function getAllPlayerCoins()
	for _, player in pairs(Players:GetPlayers()) do
		local coins = player.leaderstats.Coins.Value
		local success, err = pcall(function()
			CoinsDataStore:SetAsync(player.UserId, coins)
		end)
	end
end

function CreateLeaderBoard()
	
	local success, err = pcall(function()
		
		local data = CoinsDataStore:GetSortedAsync(false,20)
		local currentPage = data:GetCurrentPage()
		print(currentPage)

		for rank,data in ipairs(currentPage) do

			local userId = data.key
			local userName = Players:GetNameFromUserIdAsync(userId)
			local coins = data.value

			if coins > 0 then
				local NewTemplateFrame = TemplateFrame:Clone()
				NewTemplateFrame.Label_rank.Text = "No." ..rank
				NewTemplateFrame.Label_name.Text = userName
				NewTemplateFrame.Label_coins.Text = coins

				NewTemplateFrame.Parent = ScrollingFrame
				NewTemplateFrame.Name = userName

			end
		end
	end)
end

while true do
	
	ClearLeaderBoard()
	getAllPlayerCoins()
	CreateLeaderBoard()
	
	task.wait(30)
end

実行して下記のようにランキングが表示されたらOKです。