Buat GUI

Saat ini, banyak informasi permainan saat ini ada di jendela Keluaran, tidak terlihat oleh pemain.Jadi pemain dapat diberi tahu tentang apa yang terjadi dalam game, Anda akan membuat antarmuka pengguna grafis (GUI) dan mengkodifikasinya.

Tampilkan informasi dengan GUI

Untuk permainan ini, label teks akan menampilkan status permainan saat ini serta jumlah dan waktu pemain yang tersisa.

>

Menyiapkan GUI

Pertama, buat objek GUI Layar untuk menampung elemen teks yang berbeda.Ketika pemain memindahkan kamera, GUI layar tetap di tempat yang sama di layar mereka.

Untuk memastikan semua pemain melihat tampilan yang sama, letakkan GUI di folder StarterGUI . Saat permainan dimulai, folder ini disalin ke semua pemain.

1. Di folder StarterGUI, buat ScreenGUI baru. Kemudian di ScreenGUI, tambahkan Label Teks baru dengan nama StatusText.

   

2. Untuk memindahkan label, di Explorer, pilih StatusText.Kemudian, dalam pandangan permainan, seret label di mana Anda ingin itu.Angka Anda mungkin berbeda dari video.Label juga dapat diubah ukurannya menggunakan titik anker di sudut.

Skrip GUI

Untuk mencerminkan perubahan dalam game, skrip perlu memperbarui elemen GUI.kejadian, status permainan, apakah itu istirahat atau ronde aktif, akan disimpan dalam StringValue dan diperbarui menggunakan skrip lokal.

Menyiapkan skrip

Skrip StatusDisplay akan digunakan untuk memperbarui GUI pemain setiap kali status permainan berubah.

1. Di ReplicatedStorage , buat folder bernama DisplayValues.Di folder itu, tambahkan StringValue bernama Status.Untuk menguji nilai nanti, berikan nilai sementara, seperti "Selamat Datang di Pertempuran!".

   

   Karena skrip lokal hanya dijalankan di perangkat pemain, mereka tidak dapat disimpan di folder Server seperti ServerStorage.ReplicatedStorage adalah folder yang tersedia baik untuk klien (perangkat) dan server.

2. Di StarterGUI > ScreenGUI > Status, tambahkan skrip lokal baru bernama StatusDisplay. Skrip yang mempengaruhi GUI sering diberikan ke elemen GUI itu.

   

3. Buka StatusDisplay dan definisikan variabel berikut untuk diikuti:

   • Layanan Penyimpanan Replikasi

   • Folder DisplayValues

   • Status StringValue

   • Label Teks - gunakan script.Parent .

     local ReplicatedStorage = game:GetService("ReplicatedStorage")
     local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
     local status = displayValues:WaitForChild("Status")
     
     local textLabel = script.Parent

Mengubah label teks

Untuk mengubah teks di label, gunakan acara yang diubah sehingga setiap kali string Status diubah oleh skrip lain, label teks akan diperbarui.

1. Kode fungsi baru bernama updateText() . Dalam fungsi itu, atur properti Teks dari textLabel ke status.Value .

   local textLabel = script.Parent
   
   local function updateText()
   	textLabel.Text = status.Value
   end

2. Hubungkan fungsi ke acara yang diubah.

   local function updateText()
   	textLabel.Text = status.Value
   end
   
   status.Changed:Connect(updateText)

3. Jadi pemain melihat status terbaru saat memulai game, jalankan updateText() di akhir skrip.

   local function updateText()
   	textLabel.Text = status.Value
   end
   
   status.Changed:Connect(updateText)
   updateText()

4. Jalankan permainan dan konfirmasikan bahwa Anda melihat nilai sementara di layar.

   

Buat manajer tampilan

Selama game, label teks perlu mendapatkan informasi dari GameManager, MatchManager, dan mungkin skrip lainnya.Jadi skrip yang berbeda ini dapat memperbarui label teks saat diperlukan, membuat skrip modul bernama DisplayManager.

Menyiapkan skrip

Karena DisplayManager perlu berkomunikasi dengan skrip lain, itu akan menjadi skrip modul.

1. Di ServerStorage > Skrip Modul , buat skrip modul baru bernama DisplayManager.Ganti nama tabel modul untuk cocok dengan nama skrip.

2. Tambahkan variabel lokal untuk hal mengikuti: Replicated Storage, folder DisplayValues, Status.

   local DisplayManager = {}
   
   -- Layanan
   local ReplicatedStorage = game:GetService("ReplicatedStorage")
   
   -- Tampilkan Nilai yang digunakan untuk memperbarui GUI Pemain
   local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
   local status = displayValues:WaitForChild("Status")
   
   -- Fungsi Lokal
   
   -- Fungsi Modul
   
   return DisplayManager

3. Buat fungsi modul baru bernama updateStatus() yang memperbarui string di nilai Status. Skrip lain akan dapat memanggil fungsi ini.

   -- Fungsi Lokal
   
   -- Fungsi Modul
   function DisplayManager.updateStatus(newStatus)
   	status.Value = newStatus
   end

Perbarui status tekstu

Dengan Manajer Tampilan diatur, itu dapat digunakan di skrip lain untuk memperbarui label teks GUI.Sebagai pesan pertama di GUI, tampilkan awal dan akhir istirahat melalui skrip GameManager.

1. Di ServerScriptService > GameManager, buat variabel bernama displayManager dan memerlukan modul DisplayManager di ServerStorage.

   -- Layanan
   local ReplicatedStorage = game:GetService("ReplicatedStorage")
   local ServerStorage = game:GetService("ServerStorage")
   local Players = game:GetService("Players")
   
   -- Skrip Modul
   local moduleScripts = ServerStorage:WaitForChild("ModuleScripts")
   local roundManager = require(moduleScripts:WaitForChild("RoundManager"))
   local gameSettings = require(moduleScripts:WaitForChild("GameSettings"))
   local displayManager = require(moduleScripts:WaitForChild("DisplayManager"))

2. Sebagai baris pertama setelah pernyataan while true do , panggil displayManager > updateStatus() dan berikan pesan tentang menunggu pemain.

   -- Peristiwa
   local events = ServerStorage:WaitForChild("Events")
   local matchEnd = events:WaitForChild("MatchEnd")
   
   while true do
   	displayManager.updateStatus("Waiting for Players")
   
   	repeat
   		print("Starting intermission")
   		task.wait(gameSettings.intermissionDuration)
   	until #Players:GetPlayers() >= gameSettings.minimumPlayers
   
   	task.wait(gameSettings.transitionTime)
   
   	matchManager.prepareGame()
   	matchEnd.Event:Wait()
   end

3. Setelah akhir dari loop berulang untuk jeda, panggil updateStatus() dan berikan string yang mengumumkan pertandingan dimulai.Karena Anda akan menguji dengan GUI, hapus dua pernyataan cetak untuk mencatat awal dan akhir jeda.

   while true do
   	displayManager.updateStatus("Waiting for Players")
   
   	repeat
   		task.wait(gameSettings.intermissionDuration)
   	until #Players:GetPlayers() >= gameSettings.minimumPlayers
   
   	displayManager.updateStatus("Get ready!")
   	task.wait(gameSettings.transitionTime)
   
   	matchManager.prepareGame()
   	matchEnd.Event:Wait()
   end

4. Uji permainan dengan dan tanpa pemain minimum Anda. Pesan harus membaca mengikuti:

   • Tanpa pemain minimum: "Waiting for Players" .
   • Dengan pemain minimum: "Get ready" .

Tip pemecahan masalah

Pada titik ini, jika label teks tidak menampilkan pesan pertama, atau masih menampilkan "Label", coba salah satu dari berikut ini.

• Pastikan dalam skrip lokal StatusDisplay bahwa updateText() dipanggil di bagian bawah skrip.Ini memastikan bahwa pemain mendapatkan pesan terbaru.
• Periksa apakah StringValue Status ada di ReplicatedStorage.Karena sifat unik dari hubungan klien-server, jika berada di ServerStorage, skrip lokal tidak akan dapat menemukannya.

Tampilkan status pertandingan

Selama mencocokkan, GUI akan menampilkan dua angka: jumlah pemain yang tersisa dan waktu. Saat angka-angka ini berubah, label teks juga akan berubah.

Tetapkan nilai dan fungsi

IntValues akan digunakan untuk menyimpan hitungan pemain dan waktu yang tersisa.

1. Di ReplicatedStorage > DisplayValues, buat dua IntValues bernama PlayersLeft dan TimeLeft.

   

2. Di DisplayManager, tambahkan variabel untuk menyimpan nilai pemain yang tersisa dan waktu yang tersisa.

   local DisplayManager = {}
   
   -- Layanan
   local ReplicatedStorage = game:GetService("ReplicatedStorage")
   
   -- Tampilkan Nilai yang digunakan untuk memperbarui GUI Pemain
   local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
   local status = displayValues:WaitForChild("Status")
   local playersLeft = displayValues:WaitForChild("PlayersLeft")
   local timeLeft = displayValues:WaitForChild("TimeLeft")

3. Buat fungsi lokal bernama updateMatchStatus() . Kemudian, atur nilai status untuk menampilkan jumlah pemain yang tersisa dan waktu yang tersisa.

   local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
   local status = displayValues:WaitForChild("Status")
   local playersLeft = displayValues:WaitForChild("PlayersLeft")
   local timeLeft = displayValues:WaitForChild("TimeLeft")
   
   -- Fungsi Lokal
   local function updateRoundStatus()
   	status.Value = "Players Left: " .. playersLeft.Value .. " / Time Left: " .. timeLeft.Value
   end

4. Untuk kedua variabel IntValue, hubungkan updateRoundStatus() ke acara yang diubah.

   -- Fungsi Modul
   function DisplayManager.updateStatus(newStatus)
   	status.Value = newStatus
   end
   
   playersLeft.Changed:Connect(updateRoundStatus)
   timeLeft.Changed:Connect(updateRoundStatus)
   
   return DisplayManager

   Belum menguji. Tidak ada yang telah memperbarui nilai PlayersLeft atau TimeLeft, jadi status tidak akan berubah setelah ronde dimulai.

Tampilkan pemain

Selanjutnya, tambahkan kode untuk menampilkan jumlah pemain di awal game.Pelajaran selanjutnya akan memperbarui nilai PlayersLeft saat pemain dieliminasi dari game.

1. Di PlayerManager, tambahkan variabel lokal untuk layanan ReplicatedStorage, folder DisplayValues dan IntValue IntPlayer.

   local PlayerManager = {}
   
   -- Layanan
   local Players = game:GetService("Players")
   local ServerStorage = game:GetService("ServerStorage")
   local ReplicatedStorage = game:GetService("ReplicatedStorage")
   
   -- Variabel Peta
   local lobbySpawn = workspace.Lobby.StartSpawn
   local arenaMap = workspace.Arena
   local spawnLocations = arenaMap.SpawnLocations
   
   -- Nilai
   local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
   local playersLeft = displayValues:WaitForChild("PlayersLeft")

2. Tampilkan hitungan pemain awal dengan menetapkan nilai playersLeft ke ukuran array pemain aktif.

   Kemudian, di sendPlayersToMatch() , di bawah loop for, ketik: playersLeft.Value = #activePlayers

   function PlayerManager.sendPlayersToMatch()
   	local availableSpawnPoints = spawnLocations:GetChildren()
   
   	for playerKey, whichPlayer in Players:GetPlayers() do
   		table.insert(activePlayers, whichPlayer)
   
   		local spawnLocation = table.remove(availableSpawnPoints, 1)
   		preparePlayer(whichPlayer, spawnLocation)
   	end
   
   	playersLeft.Value = #activePlayers
   end

Tampilkan timer

Ingat bahwa skrip modul digunakan untuk menyentralisasi kode serupa.Karena waktu tercatat di MatchManager, perbarui nilai TimeLeft menggunakan fungsi dari skrip Timer.Manajer tampilan akan mendengarkan perubahan pada TimeLeft, dan diperbarui untuk sesuai dengan nilai baru.

1. Di MatchManager, buat variabel untuk menyimpan layanan ReplicatedStorage , folder DisplayValues dan nilai TimeLeft.

   local MatchManager = {}
   
   -- Layanan
   local ServerStorage = game:GetService("ServerStorage")
   local ReplicatedStorage = game:GetService("ReplicatedStorage")
   
   -- Skrip Modul
   local moduleScripts = ServerStorage:WaitForChild("ModuleScripts")
   local playerManager = require(moduleScripts:WaitForChild("PlayerManager"))
   local gameSettings = require(moduleScripts:WaitForChild("GameSettings"))
   local timer = require(moduleScripts:WaitForChild("Timer"))
   
   -- Peristiwa
   local events = ServerStorage:WaitForChild("Events")
   local matchStart = events:WaitForChild("MatchStart")
   
   -- Nilai
   local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
   local timeLeft = displayValues:WaitForChild("TimeLeft")
   
   local myTimer = timer.new()

2. Temukan fungsi startTimer() . Setelah peristiwa Finished timer, salin dan tempel seluruhnya, disorot saat loop di bawah ini.Kode menjalankan loop untuk memperbarui nilai timeLeft sampai timer masih aktif.

   while myTimer:isRunning() do
   	-- Menambahkan +1 memastikan tampilan timer berakhir di 1 bukan 0.
   	timeLeft.Value = (myTimer:getTimeLeft() + 1) // 1
   	-- Dengan tidak menetapkan waktu untuk menunggu, ia menawarkan looping yang lebih akurat
   	task.wait()
   end

   Saat ditambahkan, kode harus terlihat seperti sampel di bawah ini.

   local function startTimer()
   	print("Timer started")
   	myTimer:start(gameSettings.matchDuration)
   	myTimer.finished:Connect(timeUp)
   
   	while myTimer:isRunning() do
   		-- Menambahkan +1 memastikan tampilan timer berakhir di 1 bukan 0.
   		timeLeft.Value = (myTimer:getTimeLeft() + 1) // 1
   		-- Dengan tidak menetapkan waktu untuk menunggu, ia menawarkan looping yang lebih akurat
   		task.wait()
   	end
   end

3. Jalankan permainan dengan pemain minimum. Periksa apakah teks status ditampilkan:

   • Jumlah pemain awal yang benar. Ingat, angka ini tidak akan berubah sampai kode tambahan ditambahkan dalam pelajaran masa depan.
   • Waktu berkurang setiap detik sampai berhenti di 1.

Skrip selesai

Di bawah ini adalah skrip yang selesai untuk memeriksa ulang pekerjaan Anda.

Skrip Manajer Game

-- Layanan
local ServerStorage = game:GetService("ServerStorage")
local Players = game:GetService("Players")

-- Skrip Modul
local moduleScripts = ServerStorage:WaitForChild("ModuleScripts")
local matchManager = require(moduleScripts:WaitForChild("MatchManager"))
local gameSettings = require(moduleScripts:WaitForChild("GameSettings"))
local displayManager = require(moduleScripts:WaitForChild("DisplayManager"))

-- Peristiwa
local events = ServerStorage:WaitForChild("Events")
local matchEnd = events:WaitForChild("MatchEnd")

while true do
	displayManager.updateStatus("Waiting for Players")

	repeat
		task.wait(gameSettings.intermissionDuration)
	until #Players:GetPlayers() >= gameSettings.minimumPlayers

	displayManager.updateStatus("Get ready!")
	task.wait(gameSettings.transitionTime)

	matchManager.prepareGame()
	matchEnd.Event:Wait()
end

Skrip Manajer Layar

local DisplayManager = {}

-- Layanan
local ReplicatedStorage = game:GetService("ReplicatedStorage")

-- Tampilkan Nilai yang digunakan untuk memperbarui GUI Pemain
local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
local status = displayValues:WaitForChild("Status")
local playersLeft = displayValues:WaitForChild("PlayersLeft")
local timeLeft = displayValues:WaitForChild("TimeLeft")

-- Fungsi Lokal
local function updateRoundStatus()
	status.Value = "Players Left: " .. playersLeft.Value .. " / Time Left: " .. timeLeft.Value
end

-- Fungsi Modul
function DisplayManager.updateStatus(newStatus)
	status.Value = newStatus
end

playersLeft.Changed:Connect(updateRoundStatus)
timeLeft.Changed:Connect(updateRoundStatus)

return DisplayManager

Skrip Manajer Pertandingan

local ReplicatedStorage = game:GetService("ReplicatedStorage")

-- Skrip Modul
local moduleScripts = ServerStorage:WaitForChild("ModuleScripts")
local playerManager = require(moduleScripts:WaitForChild("PlayerManager"))
local gameSettings = require(moduleScripts:WaitForChild("GameSettings"))
local timer = require(moduleScripts:WaitForChild("Timer"))

-- Peristiwa
local events = ServerStorage:WaitForChild("Events")
local matchStart = events:WaitForChild("MatchStart")
local matchEnd = events:WaitForChild("MatchEnd")

-- Nilai
local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
local timeLeft = displayValues:WaitForChild("TimeLeft")

local myTimer = timer.new()

-- Fungsi Lokal
local function timeUp()
	print("Time is up!")
end

local function startTimer()
	print("Timer started")
	myTimer:start(gameSettings.matchDuration)
	myTimer.finished:Connect(timeUp)

	while myTimer:isRunning() do
		-- Menambahkan +1 memastikan tampilan timer berakhir di 1 bukan 0.
		timeLeft.Value = (myTimer:getTimeLeft() + 1) // 1
		-- Dengan tidak menetapkan waktu untuk menunggu, ia menawarkan looping yang lebih akurat
		task.wait()
	end
end

-- Fungsi Modul
function MatchManager.prepareGame()
	playerManager.sendPlayersToMatch()
	matchStart:Fire()
end

matchStart.Event:Connect(startTimer)

return MatchManager

Skrip Tampilan Status

local ReplicatedStorage = game:GetService("ReplicatedStorage")
local displayValues = ReplicatedStorage:WaitForChild("DisplayValues")
local status = displayValues:WaitForChild("Status")

local textLabel = script.Parent

local function updateText()
	textLabel.Text = status.Value
end

status.Changed:Connect(updateText)
updateText()