GuiObject

Tampilkan yang Tidak Digunakan Lagi

*Konten ini diterjemahkan menggunakan AI (Beta) dan mungkin mengandung kesalahan. Untuk melihat halaman ini dalam bahasa Inggris, klik di sini.

Tidak Dapat Dibuat
Tidak Dapat Dijelajahi

GuiObject adalah kelas abstrak (sama seperti BasePart ) untuk objek antarmuka pengguna 2

Untuk mengeksploitasi tata letak objek GUI dengan cara khusus, Anda dapat menggunakan struktur tata letak seperti daftar/ Fleksi atau grid , dan Anda dapat menyelubunginya melalui modifikator tampilan .

Meskipun mungkin untuk mendeteksi acara tombol pada setiap objek GUI menggunakan InputBegan dan InputEnded, hanya ImageButton dan 1> Class.TextButton

Rangkuman

Properti

Properti diwarisi dari GuiBase2d

Metode

Acara

Acara diwarisi dari GuiBase2d

Properti

Active

Baca Paralel

Properti ini menentukan apakah GuiObject ini akan menyinkronkan input ke ruang 3D, seperti model dasar dengan kelas ClickDetector seperti DragDetector . Artinya, jika pemain mencoba untuk mengklik detector dengan mouse menyentuh UI aktif, UI akan memblokir input dari mencapai detector.

Untuk GuiButton objek (ImageButton dan Class.TextButton

Contoh Kode

TextButton Active Debounce

-- Place this LocalScript within a TextButton (or ImageButton)
local textButton = script.Parent
textButton.Text = "Click me"
textButton.Active = true
local function onActivated()
-- This acts like a debounce
textButton.Active = false
-- Count backwards from 5
for i = 5, 1, -1 do
textButton.Text = "Time: " .. i
task.wait(1)
end
textButton.Text = "Click me"
textButton.Active = true
end
textButton.Activated:Connect(onActivated)

AnchorPoint

Baca Paralel

Properti AnchorPoint menentukan poin asal dari GuiObject , relatif terhadap ukurannya yang relatif. GuiObject.Position menentukan dari mana elemen ditempatkan (melalui 1>Class.GuiObject.Position1> ) dan dari mana 4>Class.GuiObject.Size4> ekspansi di render.

Lihat di sini untuk diagram dan rincian yang dijelaskan.

Contoh Kode

AnchorPoint Demo

local guiObject = script.Parent
while true do
-- Top-left
guiObject.AnchorPoint = Vector2.new(0, 0)
guiObject.Position = UDim2.new(0, 0, 0, 0)
task.wait(1)
-- Top
guiObject.AnchorPoint = Vector2.new(0.5, 0)
guiObject.Position = UDim2.new(0.5, 0, 0, 0)
task.wait(1)
-- Top-right
guiObject.AnchorPoint = Vector2.new(1, 0)
guiObject.Position = UDim2.new(1, 0, 0, 0)
task.wait(1)
-- Left
guiObject.AnchorPoint = Vector2.new(0, 0.5)
guiObject.Position = UDim2.new(0, 0, 0.5, 0)
task.wait(1)
-- Dead center
guiObject.AnchorPoint = Vector2.new(0.5, 0.5)
guiObject.Position = UDim2.new(0.5, 0, 0.5, 0)
task.wait(1)
-- Right
guiObject.AnchorPoint = Vector2.new(1, 0.5)
guiObject.Position = UDim2.new(1, 0, 0.5, 0)
task.wait(1)
-- Bottom-left
guiObject.AnchorPoint = Vector2.new(0, 1)
guiObject.Position = UDim2.new(0, 0, 1, 0)
task.wait(1)
-- Bottom
guiObject.AnchorPoint = Vector2.new(0.5, 1)
guiObject.Position = UDim2.new(0.5, 0, 1, 0)
task.wait(1)
-- Bottom-right
guiObject.AnchorPoint = Vector2.new(1, 1)
guiObject.Position = UDim2.new(1, 0, 1, 0)
task.wait(1)
end

AutomaticSize

Baca Paralel

Elemen UI orang tua dianggap secara otomatis dengan ukuran anak cucu mereka. Anda dapat menggunakan elemen UI ini untuk menambahkan teks dan konten lain ke objek UI saat diedit atau dijalankan, dan ukuran akan disesuaikan untuk menyesuaikan konten itu.

Ketika AutomaticSize diatur ke nilai Enum.AutomaticSize ke apa pun selain None, objek UI ini dapat diubah tergantung pada konten anaknya.

Untuk lebih banyak informasi tentang cara menggunakan property ini dan cara kerjanya, silakan lihat di sini .

Contoh Kode

LocalScript in a ScreenGui

-- Array of text labels/fonts/sizes to output
local labelArray = {
{ text = "Lorem", font = Enum.Font.Creepster, size = 50 },
{ text = "ipsum", font = Enum.Font.IndieFlower, size = 35 },
{ text = "dolor", font = Enum.Font.Antique, size = 55 },
{ text = "sit", font = Enum.Font.SpecialElite, size = 65 },
{ text = "amet", font = Enum.Font.FredokaOne, size = 40 },
}
-- Create an automatically-sized parent frame
local parentFrame = Instance.new("Frame")
parentFrame.AutomaticSize = Enum.AutomaticSize.XY
parentFrame.BackgroundColor3 = Color3.fromRGB(90, 90, 90)
parentFrame.Size = UDim2.fromOffset(25, 100)
parentFrame.Position = UDim2.fromScale(0.1, 0.1)
parentFrame.Parent = script.Parent
-- Add a list layout
local listLayout = Instance.new("UIListLayout")
listLayout.Padding = UDim.new(0, 5)
listLayout.Parent = parentFrame
-- Set rounded corners and padding for visual aesthetics
local roundedCornerParent = Instance.new("UICorner")
roundedCornerParent.Parent = parentFrame
local uiPaddingParent = Instance.new("UIPadding")
uiPaddingParent.PaddingTop = UDim.new(0, 5)
uiPaddingParent.PaddingLeft = UDim.new(0, 5)
uiPaddingParent.PaddingRight = UDim.new(0, 5)
uiPaddingParent.PaddingBottom = UDim.new(0, 5)
uiPaddingParent.Parent = parentFrame
for i = 1, #labelArray do
-- Create an automatically-sized text label from array
local childLabel = Instance.new("TextLabel")
childLabel.AutomaticSize = Enum.AutomaticSize.XY
childLabel.Size = UDim2.fromOffset(75, 15)
childLabel.Text = labelArray[i]["text"]
childLabel.Font = labelArray[i]["font"]
childLabel.TextSize = labelArray[i]["size"]
childLabel.TextColor3 = Color3.new(1, 1, 1)
childLabel.Parent = parentFrame
-- Visual aesthetics
local roundedCorner = Instance.new("UICorner")
roundedCorner.Parent = childLabel
local uiPadding = Instance.new("UIPadding")
uiPadding.PaddingTop = UDim.new(0, 5)
uiPadding.PaddingLeft = UDim.new(0, 5)
uiPadding.PaddingRight = UDim.new(0, 5)
uiPadding.PaddingBottom = UDim.new(0, 5)
uiPadding.Parent = childLabel
task.wait(2)
end

BackgroundColor3

Baca Paralel

Item ini menentukan warna latar belakang GuiObject (warna isi). Jika elemen Anda berisi teks, seperti TextBox , TextButton , atau 1> Class.TextLabel1>, pastikan warna latar belakang Anda kontras warna teks.

Propiedad lain yang menentukan propperti visual latar belakang adalah GuiObject.BackgroundTransparency ; jika ini di set ke 1, maka latar belakang maupun perbatasan tidak akan rendah.

Lihat juga BorderColor3 .

Contoh Kode

Rainbow Frame

-- Put this code in a LocalScript in a Frame
local frame = script.Parent
while true do
for hue = 0, 255, 4 do
-- HSV = hue, saturation, value
-- If we loop from 0 to 1 repeatedly, we get a rainbow!
frame.BorderColor3 = Color3.fromHSV(hue / 256, 1, 1)
frame.BackgroundColor3 = Color3.fromHSV(hue / 256, 0.5, 0.8)
task.wait()
end
end

BackgroundTransparency

Baca Paralel

Properti ini menentukan transparansi latar belakang dan batas GuiObject dan Class.TextButton atau 1> Class.TextLabel1>; transparansi teks dideterminasikan oleh <

Jika property ini di set ke 1, maka latar belakang maupun perbatasan tidak akan rendah dan latar belakang GUI akan benar-benar transparan.

BorderColor3

Baca Paralel

Mengubah warna GuiObject batas persegi (juga dikenal sebagai warna pensil). Ini berbeda dari batas GuiObject.BackgroundColor3 . Anda tidak akan dapat melihat batas objek jika batas GuiObject.BorderSizePixel di set ke 1> 01> .

Catat bahwa komponen UIStroke memungkinkan efek batas yang lebih canggih.

Contoh Kode

Button Highlight

-- Put me inside some GuiObject, preferrably an ImageButton/TextButton
local button = script.Parent
local function onEnter()
button.BorderSizePixel = 2
button.BorderColor3 = Color3.new(1, 1, 0) -- Yellow
end
local function onLeave()
button.BorderSizePixel = 1
button.BorderColor3 = Color3.new(0, 0, 0) -- Black
end
-- Connect events
button.MouseEnter:Connect(onEnter)
button.MouseLeave:Connect(onLeave)
-- Our default state is "not hovered"
onLeave()

BorderMode

Baca Paralel

Item ini menentukan dengan cara apa batas GuiObject diatur relatif terhadap dimensinya menggunakan daftar nama yang sama, Enum.BorderMode .

Catat bahwa UIStroke dapat mengatasi property ini dan memungkinkan efek batas yang lebih canggih.

BorderSizePixel

Baca Paralel

Item ini menentukan seberapa lebar GuiObject batas rendah, dalam pixel. Mengatur ini ke 0 menonaktifkan batas sepenuhnya.

Catat bahwa UIStroke dapat mengatasi property ini dan memungkinkan efek batas yang lebih canggih.

Contoh Kode

Button Highlight

-- Put me inside some GuiObject, preferrably an ImageButton/TextButton
local button = script.Parent
local function onEnter()
button.BorderSizePixel = 2
button.BorderColor3 = Color3.new(1, 1, 0) -- Yellow
end
local function onLeave()
button.BorderSizePixel = 1
button.BorderColor3 = Color3.new(0, 0, 0) -- Black
end
-- Connect events
button.MouseEnter:Connect(onEnter)
button.MouseLeave:Connect(onLeave)
-- Our default state is "not hovered"
onLeave()

ClipsDescendants

Baca Paralel

Elemen ini menentukan apakah GuiObject akan memotong (membuat tidak terlihat) setiap bagian dari elemen GUI turunan yang akan rendah di luar batas perbatasan persegi.

Catat bahwa GuiObject.Rotation tidak didukung oleh property ini. Jika GUI leluhur ini atau GUI asalnya memiliki non-零 GuiObject.Rotation, propperti ini diabaikan dan elemen GUI yang turun akan di render karena nilai propperti ini.

Hanya Baca
Tidak Direplikasi
Baca Paralel

Ketika jari pemain di tekan dan dipegang di Class

Interactable

Baca Paralel

Mengesok apakah GuiButton dapat diinteraksikan dengan atau tidak, atau apakah GuiState dari GuiObject berubah atau tidak.

Pada GuiButton :

  • Ketika pengaturan Interactable di pengaturan GuiButton di set ke false, maka 1> Class.GuiButton1> tidak lagi bisa ditekan atau diklik, dan 4> Class
  • Ketika pengaturan Interactable di pengaturan GuiButton di set ke true, maka 1> Class.GuiButton1> akan bersikap normal lagi dan 4> Class.GuiObject.GuiState|GuiState4> akan bersikap normal.

Pada GuiObject :

  • Ketika pengaturan Interactable di GuiButton tetap pada false, maka 1>Class.GuiObject.GuiState|GuiState1> akan selalu di tetap pada 4>Ennum.GuiState.NonInteractable|NonInteractable4> .
  • Ketika pengaturan Interactable di pengaturan GuiButton di set ke true, maka 1> Class.GuiObject.GuiState|GuiState1> akan bersikap normal lagi.

LayoutOrder

Baca Paralel

Item ini mengontrol urutan sorting dari GuiObject saat menggunakan UIGridStyleLayout (seperti UIListLayout atau 1>Class.UIPageLayout1> ) dengan 4>Class.U

GuiObjects diurutkan dalam urutan naik dari di mana nilai yang lebih rendah mengambil prioritas atas nilai yang lebih tinggi. Objek dengan nilai yang sama jatuh kembali ke urutan di mana mereka ditambahkan.

Jika Anda tidak yakin apakah Anda perlu menambahkan elemen di antara dua elemen yang ada di masa depan, itu's a good practice to use multiples of 100 ( 0 , 100 , 1> 2001> , dll). Ini menjamin ruang pemesanan yang besar yang

Lihat juga ZIndex yang menentukan urutan render objek alih-alih mengurutkan urutan.

NextSelectionDown

Baca Paralel

Item ini menetapkan GuiObject yang dipilih ketika pengguna menyeret gamepad ke bawah. Jika item ini kosong, menyeret gamepad ke bawah tidak akan mengubah GUI yang dipilih.

Menggeser tombol gamepad ke bawah menetapkan GuiService.SelectedObject ke objek ini kecuali jika GUI bukan Selectable . Catat bahwa property ini dapat diatur ke objek GUI bahkan jika itu bukan Selectable, jadi Anda harus

Lihat juga NextSelectionUp , NextSelectionLeft , dan NextSelectionRight .

Contoh Kode

Creating a Gamepad Selection Grid

-- Setup the Gamepad selection grid using the code below
local container = script.Parent:FindFirstChild("Container")
local grid = container:GetChildren()
local rowSize = container:FindFirstChild("UIGridLayout").FillDirectionMaxCells
for _, gui in pairs(grid) do
if gui:IsA("GuiObject") then
local pos = gui.Name
-- Left edge
gui.NextSelectionLeft = container:FindFirstChild(pos - 1)
-- Right edge
gui.NextSelectionRight = container:FindFirstChild(pos + 1)
-- Above
gui.NextSelectionUp = container:FindFirstChild(pos - rowSize)
-- Below
gui.NextSelectionDown = container:FindFirstChild(pos + rowSize)
end
end
-- Test the Gamepad selection grid using the code below
local GuiService = game:GetService("GuiService")
local UserInputService = game:GetService("UserInputService")
GuiService.SelectedObject = container:FindFirstChild("1")
function updateSelection(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
local key = input.KeyCode
local selectedObject = GuiService.SelectedObject
if not selectedObject then
return
end
if key == Enum.KeyCode.Up then
if not selectedObject.NextSelectionUp then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Down then
if not selectedObject.NextSelectionDown then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Left then
if not selectedObject.NextSelectionLeft then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Right then
if not selectedObject.NextSelectionRight then
GuiService.SelectedObject = selectedObject
end
end
end
end
UserInputService.InputBegan:Connect(updateSelection)

NextSelectionLeft

Baca Paralel

Item ini menetapkan GuiObject yang dipilih saat pengguna menyeret gamepad ke kiri. Jika item ini kosong, menempatkan gamepad ke kiri tidak akan mengubah GUI yang dipilih.

Menggeser papan game ke kiri menetapkan GuiService.SelectedObject ke objek ini kecuali jika GUI bukan Selectable . Perhatikan bahwa property ini dapat diatur ke objek GUI bahkan jika itu bukan Selectable, jadi Anda harus

Lihat juga NextSelectionUp , NextSelectionDown , dan NextSelectionRight .

Contoh Kode

Creating a Gamepad Selection Grid

-- Setup the Gamepad selection grid using the code below
local container = script.Parent:FindFirstChild("Container")
local grid = container:GetChildren()
local rowSize = container:FindFirstChild("UIGridLayout").FillDirectionMaxCells
for _, gui in pairs(grid) do
if gui:IsA("GuiObject") then
local pos = gui.Name
-- Left edge
gui.NextSelectionLeft = container:FindFirstChild(pos - 1)
-- Right edge
gui.NextSelectionRight = container:FindFirstChild(pos + 1)
-- Above
gui.NextSelectionUp = container:FindFirstChild(pos - rowSize)
-- Below
gui.NextSelectionDown = container:FindFirstChild(pos + rowSize)
end
end
-- Test the Gamepad selection grid using the code below
local GuiService = game:GetService("GuiService")
local UserInputService = game:GetService("UserInputService")
GuiService.SelectedObject = container:FindFirstChild("1")
function updateSelection(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
local key = input.KeyCode
local selectedObject = GuiService.SelectedObject
if not selectedObject then
return
end
if key == Enum.KeyCode.Up then
if not selectedObject.NextSelectionUp then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Down then
if not selectedObject.NextSelectionDown then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Left then
if not selectedObject.NextSelectionLeft then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Right then
if not selectedObject.NextSelectionRight then
GuiService.SelectedObject = selectedObject
end
end
end
end
UserInputService.InputBegan:Connect(updateSelection)

NextSelectionRight

Baca Paralel

Item ini menetapkan GuiObject yang dipilih saat pengguna menyeret gamepad ke kanan. Jika item ini kosong, menempatkan gamepad ke kanan tidak akan mengubah GUI yang dipilih.

Menggerakkan papan game ke kanan menetapkan GuiService.SelectedObject ke objek ini kecuali jika GUI tidak Selectable . Catat bahwa property ini dapat diatur ke objek GUI bahkan jika itu bukan Selectable, jadi Anda harus

Lihat juga NextSelectionUp , NextSelectionDown , dan NextSelectionLeft .

Contoh Kode

Creating a Gamepad Selection Grid

-- Setup the Gamepad selection grid using the code below
local container = script.Parent:FindFirstChild("Container")
local grid = container:GetChildren()
local rowSize = container:FindFirstChild("UIGridLayout").FillDirectionMaxCells
for _, gui in pairs(grid) do
if gui:IsA("GuiObject") then
local pos = gui.Name
-- Left edge
gui.NextSelectionLeft = container:FindFirstChild(pos - 1)
-- Right edge
gui.NextSelectionRight = container:FindFirstChild(pos + 1)
-- Above
gui.NextSelectionUp = container:FindFirstChild(pos - rowSize)
-- Below
gui.NextSelectionDown = container:FindFirstChild(pos + rowSize)
end
end
-- Test the Gamepad selection grid using the code below
local GuiService = game:GetService("GuiService")
local UserInputService = game:GetService("UserInputService")
GuiService.SelectedObject = container:FindFirstChild("1")
function updateSelection(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
local key = input.KeyCode
local selectedObject = GuiService.SelectedObject
if not selectedObject then
return
end
if key == Enum.KeyCode.Up then
if not selectedObject.NextSelectionUp then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Down then
if not selectedObject.NextSelectionDown then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Left then
if not selectedObject.NextSelectionLeft then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Right then
if not selectedObject.NextSelectionRight then
GuiService.SelectedObject = selectedObject
end
end
end
end
UserInputService.InputBegan:Connect(updateSelection)

NextSelectionUp

Baca Paralel

Item ini menetapkan GuiObject yang dipilih ketika pengguna menyeret selektor gamepad ke atas. Jika item ini kosong, menyeret gamepad ke atas tidak akan mengubah GUI yang dipilih.

Menggerakkan papan game ke atas menetapkan GuiService.SelectedObject ke objek ini kecuali jika GUI bukan Selectable . Perhatikan bahwa property ini dapat diatur ke objek GUI bahkan jika itu bukan Selectable, jadi Anda harus mem

Lihat juga NextSelectionDown , NextSelectionLeft , NextSelectionRight .

Contoh Kode

Creating a Gamepad Selection Grid

-- Setup the Gamepad selection grid using the code below
local container = script.Parent:FindFirstChild("Container")
local grid = container:GetChildren()
local rowSize = container:FindFirstChild("UIGridLayout").FillDirectionMaxCells
for _, gui in pairs(grid) do
if gui:IsA("GuiObject") then
local pos = gui.Name
-- Left edge
gui.NextSelectionLeft = container:FindFirstChild(pos - 1)
-- Right edge
gui.NextSelectionRight = container:FindFirstChild(pos + 1)
-- Above
gui.NextSelectionUp = container:FindFirstChild(pos - rowSize)
-- Below
gui.NextSelectionDown = container:FindFirstChild(pos + rowSize)
end
end
-- Test the Gamepad selection grid using the code below
local GuiService = game:GetService("GuiService")
local UserInputService = game:GetService("UserInputService")
GuiService.SelectedObject = container:FindFirstChild("1")
function updateSelection(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
local key = input.KeyCode
local selectedObject = GuiService.SelectedObject
if not selectedObject then
return
end
if key == Enum.KeyCode.Up then
if not selectedObject.NextSelectionUp then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Down then
if not selectedObject.NextSelectionDown then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Left then
if not selectedObject.NextSelectionLeft then
GuiService.SelectedObject = selectedObject
end
elseif key == Enum.KeyCode.Right then
if not selectedObject.NextSelectionRight then
GuiService.SelectedObject = selectedObject
end
end
end
end
UserInputService.InputBegan:Connect(updateSelection)

Position

Baca Paralel

Properti ini menentukan pixel dan posisi skala GuiObject menggunakan UDim2 . Posisi berada di sekitar objek's GuiObject.AnchorPoint .

Posisi skala relatif terhadap ukuran elemen GUI tertinggi, jika ada.

Bagian pixel dari nilai UDim2 sama terlepas dari ukuran GUI asli.Nilai mewakili posisi objek dalam pixel.Posisi aktual pixel objek dapat dibaca dari property GuiBase2d.AbsolutePosition.

Rotation

Baca Paralel

Properti ini menentukan jumlah derajat dengan mana GuiObject dirotasi. Rotasi relatif terhadap pusat objek, bukan pusat Class.GuiObject.AnchorPoint|AnchorPoint , yang berarti Anda tidak dapat mengubah poin rotasi. Selain itu,

Selectable

Baca Paralel

Elemen ini menentukan apakah GuiObject dapat dipilih saat menggunakan gamepad.

Jika property ini benar, GUI dapat dipilih. Memilih GUI juga menetapkan GuiService.SelectedObject property ke objek itu.

Ketika ini adalah false, GUI tidak dapat dipilih. Namun, menetapkan ini ke false ketika GUI dipilih tidak akan menetapkannya juga tidak mengubah nilai properti GuiService.SelectedObject.

Tambahkan GuiObject.SelectionGained dan GuiObject.SelectionLost tidak akan mengeksekusi untuk elemen. Untuk menghapus GuiObject, Anda harus mengubah prop性 GuiService.SelectedObject.

Properti ini berguna jika GUI terhubung ke beberapa GUI melalui property seperti ini GuiObject.NextSelectionUp , GuiObject.NextSelectionDown , Class.GuiObject|NextSelection

Contoh Kode

Limiting TextBox Selection

local GuiService = game:GetService("GuiService")
local textBox = script.Parent
local function gainFocus()
textBox.Selectable = true
GuiService.SelectedObject = textBox
end
local function loseFocus(_enterPressed, _inputObject)
GuiService.SelectedObject = nil
textBox.Selectable = false
end
-- The FocusLost and FocusGained event will fire because the textBox
-- is of type TextBox
textBox.Focused:Connect(gainFocus)
textBox.FocusLost:Connect(loseFocus)

SelectionImageObject

Baca Paralel

Item ini menggeser pengaturan pilihan default yang digunakan untuk gamepad.

Catat bahwa pilih SelectionImageObject menggabungkan pilih GuiObject dengan Size dari gambar. Untuk hasil terbaik, Anda harus menyesuaikan pilih 1> SelectionImageObject1> melalui skala 4> Datatype.UD

Mengubah SelectionImageObject untuk elemen GuiObject hanya mengubah elemen itu. Untuk mengubah semua elemen GUI pengguna, tetapkan PlayerGui.SelectionImageObject property.

Untuk menentukan atau menetapkan GUI mana yang dipilih oleh pengguna, Anda dapat menggunakan property GuiService.SelectedObject. Pemain menggunakan gamepad untuk memilih berbagai elemen GUI, menyalin

SelectionOrder

Baca Paralel

GuiObjects dengan SelectionOrder yang lebih rendah dipilih lebih awal daripada GuiObjects dengan SelectionOrder yang lebih tinggi saat memulai pemilihan gamepad atau memanggil GuiService:Select() di祖先. Hal ini tidak mengubah navigasi arah.Nilai default adalah 0.

Size

Baca Paralel

Properti ini menentukan ukuran skala dan pixel menggunakan GuiObject.

Ukuran skala relatif terhadap ukuran elemen GUI utama, jika ada.

Bagian pixel dari nilai UDim2 sama terlepas dari ukuran GUI tingkat atas.Nilai mewakili ukuran objek dalam pixel.Ukuran aktual objek dapat dibaca dari properti GuiBase2d.AbsoluteSize.

Jika GuiObject memiliki orang tua, ukurannya di setiap sumbu juga dipengaruhi oleh SizeConstraint orang tua.

Contoh Kode

Health Bar

local Players = game:GetService("Players")
local player = Players.LocalPlayer
-- Paste script into a LocalScript that is
-- parented to a Frame within a Frame
local frame = script.Parent
local container = frame.Parent
container.BackgroundColor3 = Color3.new(0, 0, 0) -- black
-- This function is called when the humanoid's health changes
local function onHealthChanged()
local human = player.Character.Humanoid
local percent = human.Health / human.MaxHealth
-- Change the size of the inner bar
frame.Size = UDim2.new(percent, 0, 1, 0)
-- Change the color of the health bar
if percent < 0.1 then
frame.BackgroundColor3 = Color3.new(1, 0, 0) -- black
elseif percent < 0.4 then
frame.BackgroundColor3 = Color3.new(1, 1, 0) -- yellow
else
frame.BackgroundColor3 = Color3.new(0, 1, 0) -- green
end
end
-- This function runs is called the player spawns in
local function onCharacterAdded(character)
local human = character:WaitForChild("Humanoid")
-- Pattern: update once now, then any time the health changes
human.HealthChanged:Connect(onHealthChanged)
onHealthChanged()
end
-- Connect our spawn listener; call it if already spawned
player.CharacterAdded:Connect(onCharacterAdded)
if player.Character then
onCharacterAdded(player.Character)
end

SizeConstraint

Baca Paralel

Elemen ini menetapkan Size sumbu yang akan dibangun di atas, relatif terhadap ukuran orang tua.

Propiedad ini berguna untuk membuat objek GUI yang dimaksudkan untuk skala dengan lebar atau tinggi dari objek tertinggi, tetapi tidak kedua, secara efektif menyimpan aspek persentase objek.

Transparency

Tersembunyi
Tidak Direplikasi
Baca Paralel

Propinsi bercampur dari BackgroundTransparency dan TextTransparency .

Visible

Baca Paralel

Properti ini apakah GuiObject dan cucu-cucunya akan di render.

Renderan komponen tunggal dari GuiObject dapat diperiksa secara individual melalui property transparansi seperti GuiObject.BackgroundTransparency , TextLabel.TextTransparency dan 1> Class.ImageLabel.ImageTransparency1> .

Ketika elemen ini adalah false , maka GuiObject akan diabaikan oleh struktur layout seperti UIListLayout , 1> Class.UIGridLayout1> dan 4> Class.UITableLayout4>. Dengan kata lain, ruang yang ditempati oleh elemen akan digun

Contoh Kode

UI Window

local gui = script.Parent
local window = gui:WaitForChild("Window")
local toggleButton = gui:WaitForChild("ToggleWindow")
local closeButton = window:WaitForChild("Close")
local function toggleWindowVisbility()
-- Flip a boolean using the `not` keyword
window.Visible = not window.Visible
end
toggleButton.Activated:Connect(toggleWindowVisbility)
closeButton.Activated:Connect(toggleWindowVisbility)

ZIndex

Baca Paralel

Elemen ini menentukan urutan di mana GuiObject menyajikan relatif terhadap yang lain.

Secara default, GuiObjects menyajikan dalam urutan prioritas meningkat di mana mereka dengan nilai ZIndex yang lebih rendah ditampilkan di bawah mereka dengan nilai ScreenGui yang lebih tinggi.

Jika Anda tidak yakin apakah Anda perlu menambahkan elemen di antara dua elemen yang ada di masa depan, itu adalah praktik yang baik untuk menggunakan multiplikasi dari 100 (0 , 100 , 1> 2001> , dll.) Ini menjamin

Lihat juga LayoutOrder yang mengontrol urutan sorting dari sebuah GuiObject ketika digunakan dengan struktur layout seperti 1> Class.UIListLayout1> atau 4> Class.UIGridLayout4>.

Metode

TweenPosition

Dengan mudah pindahkan GUI ke posisi baru UDim2 dalam waktu yang ditentukan menggunakan Enum.EasingDirection dan Enum.EasingStyle yang ditentukan.

Fungsi ini akan mengembalikan apakah tween akan bermain. Itu tidak akan bermain jika tween lainnya bermain di GuiObject dan parameter override adalah false.

Lihat juga:

Parameter

endPosition: UDim2

Di mana GUI seharusnya bergerak.

easingDirection: Enum.EasingDirection

Arah di mana untuk meredakan GUI ke posisi akhir .

Nilai Default: "Out"
easingStyle: Enum.EasingStyle

Gaya di mana untuk meredakan GUI ke posisi akhir .

Nilai Default: "Quad"
time: number

Berapa lama, dalam detik, waktu tween harus selesai.

Nilai Default: 1
override: bool

Apakah tween muda akan mengambil alih tween yang sedang berlangsung.

Nilai Default: false
callback: function

Fungsi panggilan untuk dieksekusi saat tween selesai.

Nilai Default: "nil"

Memberikan nilai

Apakah tween akan bermain.

Contoh Kode

Tween a GUI's Position

local START_POSITION = UDim2.new(0, 0, 0, 0)
local GOAL_POSITION = UDim2.new(1, 0, 1, 0)
local guiObject = script.Parent
local function callback(state)
if state == Enum.TweenStatus.Completed then
print("The tween completed uninterrupted")
elseif state == Enum.TweenStatus.Canceled then
print("Another tween cancelled this one")
end
end
-- Initialize the GuiObject position, then start the tween:
guiObject.Position = START_POSITION
local willPlay = guiObject:TweenPosition(
GOAL_POSITION, -- Final position the tween should reach
Enum.EasingDirection.In, -- Direction of the easing
Enum.EasingStyle.Sine, -- Kind of easing to apply
2, -- Duration of the tween in seconds
true, -- Whether in-progress tweens are interrupted
callback -- Function to be callled when on completion/cancelation
)
if willPlay then
print("The tween will play")
else
print("The tween will not play")
end

TweenSize

Dengan mudah mengubah ukuran GUI ke Datatype.UDim2 baru dalam waktu yang ditentukan menggunakan Enum.EasingDirection dan Enum.EasingStyle .

Fungsi ini akan mengembalikan apakah tween akan bermain. Biasanya ini akan selalu mengembalikan true, tetapi itu akan mengembalikan false jika tween lain aktif dan Override ditetapkan ke false.

Lihat juga:

Parameter

endSize: UDim2

Ukuran yang GUI harus ubah.

easingDirection: Enum.EasingDirection

Arah di mana untuk meredakan GUI ke ukuran akhir .

Nilai Default: "Out"
easingStyle: Enum.EasingStyle

Gaya di mana untuk meredakan GUI ke ukuran akhir .

Nilai Default: "Quad"
time: number

Berapa lama, dalam detik, waktu tween harus selesai.

Nilai Default: 1
override: bool

Apakah tween muda akan mengambil alih tween yang sedang berlangsung.

Nilai Default: false
callback: function

Fungsi panggilan untuk dieksekusi saat tween selesai.

Nilai Default: "nil"

Memberikan nilai

Apakah tween akan bermain.

Contoh Kode

Tween a GuiObject's Size

local guiObject = script.Parent
local function callback(didComplete)
if didComplete then
print("The tween completed successfully")
else
print("The tween was cancelled")
end
end
local willTween = guiObject:TweenSize(
UDim2.new(0.5, 0, 0.5, 0), -- endSize (required)
Enum.EasingDirection.In, -- easingDirection (default Out)
Enum.EasingStyle.Sine, -- easingStyle (default Quad)
2, -- time (default: 1)
true, -- should this tween override ones in-progress? (default: false)
callback -- a function to call when the tween completes (default: nil)
)
if willTween then
print("The GuiObject will tween")
else
print("The GuiObject will not tween")
end

TweenSizeAndPosition

Mendetail menyesuaikan dan menggerakkan GUI ke ukuran dan posisi baru menggunakan ukuran dan posisi yang ditentukan dengan menggunakan Datatype.UDim2``Enum.EasingDirection dan Enum.EasingStyle .

Fungsi ini akan mengembalikan apakah tween akan bermain. Biasanya ini akan selalu mengembalikan true, tetapi itu akan mengembalikan false jika tween lain aktif dan Override ditetapkan ke false.

Lihat juga:

Parameter

endSize: UDim2

Ukuran yang GUI harus ubah.

endPosition: UDim2

Di mana GUI seharusnya bergerak.

easingDirection: Enum.EasingDirection

Arah di mana untuk meredakan GUI ke ukuran akhir dan posisi akhir .

Nilai Default: "Out"
easingStyle: Enum.EasingStyle

Gaya di mana untuk meredakan GUI ke ukuran akhir dan posisi akhir .

Nilai Default: "Quad"
time: number

Berapa lama, dalam detik, waktu tween harus selesai.

Nilai Default: 1
override: bool

Apakah tween muda akan mengambil alih tween yang sedang berlangsung.

Nilai Default: false
callback: function

Fungsi panggilan untuk dieksekusi saat tween selesai.

Nilai Default: "nil"

Memberikan nilai

Apakah tween akan bermain.

Contoh Kode

Tween a GUI's Size and Position

local frame = script.Parent.Frame
frame:TweenSizeAndPosition(UDim2.new(0, 0, 0, 0), UDim2.new(0, 0, 0, 0))

Acara

InputBegan

Acara ini diaktifkan ketika seorang pengguna mulai berinteraksi dengan GuiObject melalui perangkat Human-Computer Interface (Tombol pemutar, sentuh mulai, tombol keyboard, dll).

The UserInputService memiliki acara bernama serupa yang tidak terbatas pada elemen UI tertentu: UserInputService.InputBegan .

Acara ini akan selalu berfungsi terlepas dari status permainan.

Lihat juga:

Parameter

Sebuah InputObject, yang berisi data yang berguna untuk mengambil masukan pengguna seperti type of input , state of input , dan 1> Class.InputObjek.Position|koordinasi layar1> .


Contoh Kode

Tracking the Beginning of Input on a GuiObject

-- In order to use the InputBegan event, you must specify the GuiObject
local gui = script.Parent
-- A sample function providing multiple usage cases for various types of user input
local function inputBegan(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
print("A key is being pushed down! Key:", input.KeyCode)
elseif input.UserInputType == Enum.UserInputType.MouseButton1 then
print("The left mouse button has been pressed down at", input.Position)
elseif input.UserInputType == Enum.UserInputType.MouseButton2 then
print("The right mouse button has been pressed down at", input.Position)
elseif input.UserInputType == Enum.UserInputType.Touch then
print("A touchscreen input has started at", input.Position)
elseif input.UserInputType == Enum.UserInputType.Gamepad1 then
print("A button is being pressed on a gamepad! Button:", input.KeyCode)
end
end
gui.InputBegan:Connect(inputBegan)

InputChanged

Acara ini diaktifkan ketika pengguna mengubah cara mereka berinteraksi melalui perangkat Human-Computer Interface (Tombol pengguna, sentuh dimulai, tombol keyboard, dll).

Class.UserInputService memiliki acara bernama serupa yang tidak terbatas pada elemen UI tertentu: UserInputService.InputChanged .

Acara ini akan selalu berfungsi terlepas dari status permainan.

Lihat juga:

Parameter

Sebuah InputObject, yang berisi data yang berguna untuk mengambil masukan pengguna seperti type of input , state of input , dan 1> Class.InputObjek.Position|koordinasi layar1> .


Contoh Kode

GuiObject InputChanged Demo

local UserInputService = game:GetService("UserInputService")
local gui = script.Parent
local function printMovement(input)
print("Position:", input.Position)
print("Movement Delta:", input.Delta)
end
local function inputChanged(input)
if input.UserInputType == Enum.UserInputType.MouseMovement then
print("The mouse has been moved!")
printMovement(input)
elseif input.UserInputType == Enum.UserInputType.MouseWheel then
print("The mouse wheel has been scrolled!")
print("Wheel Movement:", input.Position.Z)
elseif input.UserInputType == Enum.UserInputType.Gamepad1 then
if input.KeyCode == Enum.KeyCode.Thumbstick1 then
print("The left thumbstick has been moved!")
printMovement(input)
elseif input.KeyCode == Enum.KeyCode.Thumbstick2 then
print("The right thumbstick has been moved!")
printMovement(input)
elseif input.KeyCode == Enum.KeyCode.ButtonL2 then
print("The pressure being applied to the left trigger has changed!")
print("Pressure:", input.Position.Z)
elseif input.KeyCode == Enum.KeyCode.ButtonR2 then
print("The pressure being applied to the right trigger has changed!")
print("Pressure:", input.Position.Z)
end
elseif input.UserInputType == Enum.UserInputType.Touch then
print("The user's finger is moving on the screen!")
printMovement(input)
elseif input.UserInputType == Enum.UserInputType.Gyro then
local _rotInput, rotCFrame = UserInputService:GetDeviceRotation()
local rotX, rotY, rotZ = rotCFrame:toEulerAnglesXYZ()
local rot = Vector3.new(math.deg(rotX), math.deg(rotY), math.deg(rotZ))
print("The rotation of the user's mobile device has been changed!")
print("Position", rotCFrame.p)
print("Rotation:", rot)
elseif input.UserInputType == Enum.UserInputType.Accelerometer then
print("The acceleration of the user's mobile device has been changed!")
printMovement(input)
end
end
gui.InputChanged:Connect(inputChanged)

InputEnded

Acara InputEnded diaktifkan saat pengguna berhenti berinteraksi melalui perangkat Human-Computer Interface (Tombol pengguna, sentuh dimulai, tombol keyboard, dll).

The UserInputService memiliki acara bernama serupa yang tidak terbatas pada elemen UI tertentu: UserInputService.InputEnded .

Acara ini akan selalu berfungsi terlepas dari status permainan.

Lihat juga:

Parameter

Sebuah InputObject, yang berisi data yang berguna untuk mengambil masukan pengguna seperti type of input , state of input , dan 1> Class.InputObjek.Position|koordinasi layar1> .


Contoh Kode

Tracking the End of Input on a GuiObject

-- In order to use the InputChanged event, you must specify a GuiObject
local gui = script.Parent
-- A sample function providing multiple usage cases for various types of user input
local function inputEnded(input)
if input.UserInputType == Enum.UserInputType.Keyboard then
print("A key has been released! Key:", input.KeyCode)
elseif input.UserInputType == Enum.UserInputType.MouseButton1 then
print("The left mouse button has been released at", input.Position)
elseif input.UserInputType == Enum.UserInputType.MouseButton2 then
print("The right mouse button has been released at", input.Position)
elseif input.UserInputType == Enum.UserInputType.Touch then
print("A touchscreen input has been released at", input.Position)
elseif input.UserInputType == Enum.UserInputType.Gamepad1 then
print("A button has been released on a gamepad! Button:", input.KeyCode)
end
end
gui.InputEnded:Connect(inputEnded)

MouseEnter

Acara MouseEnter diaktifkan saat seorang pengguna menggerakkan mouse mereka ke elemen GUI .

Harap jangan mengandalkan argumen x dan y yang dilewati oleh acara ini sebagai cara yang aman untuk menentukan di mana mouse pengguna saat memasuki GUI. Koordinat ini dapat bervariasi bahkan ketika mouse memasuki GUI melalui sudut yang sama - khususnya ketika mouse memasuki

Acara ini bahkan menyetel saat elemen GUI rending di bawah elemen lain.

Jika Anda ingin melacak kapan mouse pengguna meninggalkan elemen GUI, Anda dapat menggunakan acara GuiObject.MouseLeave.

Lihat juga:

Parameter

Koordinat x layar mouse dalam pixel, relatif ke sudut atas kiri layar.

Koordinat layar mouse dalam pixel, relatif ke sudut atas kiri layar.


Contoh Kode

Printing where a Mouse Enters a GuiObject

local guiObject = script.Parent
guiObject.MouseEnter:Connect(function(x, y)
print("The user's mouse cursor has entered the GuiObject at position", x, ",", y)
end)

MouseLeave

Acara MouseLeave terjadi ketika pengguna menyebarkan mouse mereka dari elemen GUI.

Harap jangan mengandalkan argumen x dan y yang dilewati oleh acara ini sebagai cara yang aman untuk menentukan di mana mouse pengguna saat meninggalkan GUI. Koordinat ini dapat bervariasi bahkan ketika mouse meninggalkan GUI melalui sudut yang sama - terutama ketika mouse men

Acara ini bahkan menyetel saat elemen GUI rending di bawah elemen lain.

Lihat juga:

Parameter

Koordinat x layar mouse dalam pixel, relatif ke sudut atas kiri layar.

Koordinat layar mouse dalam pixel, relatif ke sudut atas kiri layar.


MouseMoved

Mengaktifkan setiap kali seorang pengguna menggerakkan mouse mereka saat berada di dalam elemen GUI . Ini mirip dengan Mouse.Move, yang menyebabkan terlepas dari apakah mouse pengguna berada di atas elemen GUI.

Catatan, acara ini diaktifkan ketika posisi mouse diperbarui, oleh karena itu akan diaktifkan berulang kali saat di gerakkan.

Argumen x dan y menunjukkan koordinat layar yang diperbarui dari mouse pengguna dalam pixel. Ini dapat berguna untuk menentukan lokasi mouse di GUI, layar, dan delta karena posisi mouse jika diikuti secara global.

Kode di bawah ini menunjukkan cara menentukan Vector2Offset mouse pengguna relatif terhadap elemen GUI:


local CustomScrollingFrame = script.Parent
local SubFrame = CustomScrollingFrame:FindFirstChild("SubFrame")
local mouse = game.Players.LocalPlayer:GetMouse()
function getPosition(X, Y)
local gui_X = CustomScrollingFrame.AbsolutePosition.X
local gui_Y = CustomScrollingFrame.AbsolutePosition.Y
local pos = Vector2.new(math.abs(X - gui_X), math.abs(Y - gui_Y - 36))
print(pos)
end
CustomScrollingFrame.MouseMoved:Connect(getPosition)

Catat bahwa acara ini mungkin tidak berfungsi dengan benar ketika mouse pengguna memasuki atau meninggalkan elemen GUI. Oleh karena itu, argumen x dan y mungkin tidak cocok dengan sempurna ke koordinat sudut GUI.

Lihat juga:

Parameter

Koordinat x layar mouse dalam pixel, relatif ke sudut atas kiri layar.

Koordinat layar mouse dalam pixel, relatif ke sudut atas kiri layar.


MouseWheelBackward

Acara WheelBackward menyala saat pengguna menggulir roda mouse mereka kembali saat mouse berada di atas elemen GUI . Ini mirip dengan Mouse.WheelBackward, yang menyala terlepas dari apakah mouse pengguna berada di atas elemen GUI.

Acara ini hanya menyetel sebagai indikator gerakan belakang roda. Ini berarti bahwa argumen x dan y mouse koordinat tidak berubah sebagai hasil dari acara ini. Ini hanya berubah ketika mouse bergerak, yang dapat ditracking oleh acara GuiObject.MouseMoved.

Lihat juga:

Parameter

Koordinat x layar mouse dalam pixel, relatif ke sudut atas kiri layar.

Koordinat layar mouse dalam pixel, relatif ke sudut atas kiri layar.


MouseWheelForward

Acara WheelForward diaktifkan ketika pengguna menggulir roda mouse mereka ke depan saat mouse berada di atas elemen GUI . Ini mirip dengan Mouse.WheelForward, yang mengaktifkan terlepas dari apakah mouse pengguna berada di atas elemen GUI.

Acara ini hanya menyetel sebagai indikator gerakan roda ke depan. Ini berarti bahwa argumen x dan y mouse koordinat tidak berubah sebagai hasil dari acara ini. Ini hanya berubah ketika mouse bergerak, yang dapat ditracking oleh acara GuiObject.MouseMoved.

Lihat juga:

Parameter

Koordinat x layar mouse dalam pixel, relatif ke sudut atas kiri layar.

Koordinat y dari mouse pengguna.


SelectionGained

Acara ini diaktifkan ketika pemilih Gamepad mulai fokus pada GuiObject .

Jika Anda ingin memeriksa dari Gamepad pilih berhenti fokus pada elemen GUI, Anda dapat menggunakan acara GuiObject.SelectionLost.

Ketika GUI mendapatkan fokus pemilihan, nilai dari SelectedObject property juga berubah menjadi yang mendapatkan pemilihan. Untuk menentukan GUI yang mendapatkan pemilihan, periksa nilai dari property ini.


Contoh Kode

Handling GUI Selection Gained

local guiObject = script.Parent
local function selectionGained()
print("The user has selected this button with a gamepad.")
end
guiObject.SelectionGained:Connect(selectionGained)

SelectionLost

Acara ini diaktifkan ketika pemilih Gamepad berhenti fokus pada GUI .

Jika Anda ingin memeriksa dari Gamepad pilih mulai fokus pada elemen GUI, Anda dapat menggunakan acara GuiObject.SelectionGained.

Ketika GUI kehilangan fokus pemilihan, nilai properti SelectionObject berubah menjadi nol atau elemen GUI yang mendapatkan fokus pemilihan. Untuk menentukan GUI yang mendapatkan pemilihan, atau jika tidak ada GUI yang dipilih, periksa nilai properti ini.


Contoh Kode

Handling GUI Selection Lost

local guiObject = script.Parent
local function selectionLost()
print("The user no longer has this selected with their gamepad.")
end
guiObject.SelectionLost:Connect(selectionLost)

TouchLongPress

Acara TouchLongPress menyala setelah beberapa saat ketika pemain menahan jari mereka di elemen UI menggunakan perangkat sentuh yang mendukung. Ini menyala

Karena acara ini hanya mengharuskan satu jari, acara ini dapat dimulai di Studio menggunakan emulator dan mouse.

Parameter

touchPositions: Array

Sebuah matriks Vector2 yang menggambarkan posisi relatif dari jari-jari yang terlibat dalam gerakan.

A Enum.UserInputState yang menggambarkan status gerakan:

  • Mulai api sekali di awal gerakan (setelah penundaan singkat)
  • Ganti api jika pemain menyeret jari mereka saat menekan
  • Hapus api saat berakhir saat akhir gerakan ketika mereka melepaskan jari mereka.

Contoh Kode

Move UI Element with TouchLongPress

local frame = script.Parent
frame.Active = true
local dragging = false
local basePosition
local startTouchPosition
local borderColor3
local backgroundColor3
local function onTouchLongPress(touchPositions, state)
if state == Enum.UserInputState.Begin and not dragging then
-- Start a drag
dragging = true
basePosition = frame.Position
startTouchPosition = touchPositions[1]
-- Color the frame to indicate the drag is happening
borderColor3 = frame.BorderColor3
backgroundColor3 = frame.BackgroundColor3
frame.BorderColor3 = Color3.new(1, 1, 1) -- White
frame.BackgroundColor3 = Color3.new(0, 0, 1) -- Blue
elseif state == Enum.UserInputState.Change then
local touchPosition = touchPositions[1]
local deltaPosition = UDim2.new(
0,
touchPosition.X - startTouchPosition.X,
0,
touchPosition.Y - startTouchPosition.Y
)
frame.Position = basePosition + deltaPosition
elseif state == Enum.UserInputState.End and dragging then
-- Stop the drag
dragging = false
frame.BorderColor3 = borderColor3
frame.BackgroundColor3 = backgroundColor3
end
end
frame.TouchLongPress:Connect(onTouchLongPress)

TouchPan

Acara TouchPan pada saat pemain menyesuaikan jari mereka di elemen UI menggunakan perangkat sentuh yang diaktifkan. Acara ini diaktifkan sebelum GuiObject.TouchSwipe , dan tidak diaktifkan dengan GuiObject.TouchTap. Acara ini berguna untuk memungkinkan pemain untuk menipu posisi elemen UI di layar.

Acara ini menyebabkan dengan tabel Vector2 yang menggambarkan posisi layar relatif dari jari-jari yang terlibat dalam gerakan. Selain itu, itu menyebabkan beberapa kali: Enum.UserInputState.Begin setelah jeda singkat, Enum.UserInputState.Change k

Acara ini tidak dapat dimulai menggunakan emulator dan mouse; Anda harus memiliki perangkat sentuh nyata untuk menembaknya.

Parameter

touchPositions: Array

Sebuah matriks Lua dari Vector2 objek, masing-masing menunjukkan posisi dari semua jari yang terlibat dalam gerakan.

totalTranslation: Vector2

Menunjukkan seberapa jauh gerakan panas telah pergi dari titik awalnya.

velocity: Vector2

Menunjukkan seberapa cepat gerakan dilakukan di setiap dimensi.

Menunjukkan Enum.UserInputState dari gestur.


Contoh Kode

Panning UI Element

local innerFrame = script.Parent
local outerFrame = innerFrame.Parent
outerFrame.BackgroundTransparency = 0.75
outerFrame.Active = true
outerFrame.Size = UDim2.new(1, 0, 1, 0)
outerFrame.Position = UDim2.new(0, 0, 0, 0)
outerFrame.AnchorPoint = Vector2.new(0, 0)
outerFrame.ClipsDescendants = true
local dragging = false
local basePosition
local function onTouchPan(_touchPositions, totalTranslation, _velocity, state)
if state == Enum.UserInputState.Begin and not dragging then
dragging = true
basePosition = innerFrame.Position
outerFrame.BackgroundTransparency = 0.25
elseif state == Enum.UserInputState.Change then
innerFrame.Position = basePosition + UDim2.new(0, totalTranslation.X, 0, totalTranslation.Y)
elseif state == Enum.UserInputState.End and dragging then
dragging = false
outerFrame.BackgroundTransparency = 0.75
end
end
outerFrame.TouchPan:Connect(onTouchPan)

TouchPinch

Acara TouchPinch menyala ketika pemain menggunakan dua jari untuk membuat pukulan atau tarikan gerakan di elemen UI menggunakan perangkat yang didukung sentuh. Sebuah pukulan terjadi ketika dua atau leb

Acara ini diaktifkan dengan tabel Vector2 yang menggambarkan posisi layar relatif dari jari-jari yang terlibat dalam gerakan. Selain itu, itu diaktifkan beberapa kali: Enum.UserInputState.Begin setelah

Karena acara ini memerlukan setidaknya dua jari, tidak mungkin untuk menyimpulskannya di Studio menggunakan emulator dan mouse; Anda harus memiliki perangkat sentuh nyata.

Parameter

touchPositions: Array

Sebuah matriks Lua dari Vector2 objek, masing-masing menunjukkan posisi dari semua jari yang terlibat dalam gerakan gesek.

scale: number

Pengapung yang menunjukkan perbedaan dari awal gerakan gesek.

velocity: number

Float menunjukkan seberapa cepat gerakan gesekan terjadi.

Menunjukkan Enum.UserInputState dari gestur.


Contoh Kode

Pinch/Pull Scaling

local innerFrame = script.Parent
local outerFrame = innerFrame.Parent
outerFrame.BackgroundTransparency = 0.75
outerFrame.Active = true
outerFrame.Size = UDim2.new(1, 0, 1, 0)
outerFrame.Position = UDim2.new(0, 0, 0, 0)
outerFrame.AnchorPoint = Vector2.new(0, 0)
outerFrame.ClipsDescendants = true
local dragging = false
local uiScale = Instance.new("UIScale")
uiScale.Parent = innerFrame
local baseScale
local function onTouchPinch(_touchPositions, scale, _velocity, state)
if state == Enum.UserInputState.Begin and not dragging then
dragging = true
baseScale = uiScale.Scale
outerFrame.BackgroundTransparency = 0.25
elseif state == Enum.UserInputState.Change then
uiScale.Scale = baseScale * scale -- Notice the multiplication here
elseif state == Enum.UserInputState.End and dragging then
dragging = false
outerFrame.BackgroundTransparency = 0.75
end
end
outerFrame.TouchPinch:Connect(onTouchPinch)

TouchRotate

Acara TouchRotate di ponsel ini diaktifkan ketika pemain menggunakan dua jari untuk membuat gerakan pencegahan atau menarik gerakan di elemen UI menggunakan perangkat yang didukung sentuh. Rotasi terjadi ketika sudut antara dua jari berubah. Acara ini diaktifkan bersama dengan GuiObject.TouchPan . Acara ini b

Acara ini diaktifkan dengan tabel Vector2 yang menggambarkan posisi layar relatif dari jari-jari yang terlibat dalam gerakan. Selain itu, ia diaktifkan beberapa kali: Enum.UserInputState.Begin setelah penundaan singkat, Enum.UserInputState.Change ket

Karena acara ini memerlukan setidaknya dua jari, tidak mungkin untuk disimulasikan di Studio menggunakan emulator dan mouse; Anda harus memiliki perangkat sentuh nyata.

Parameter

touchPositions: Array

Sebuah matriks Lua dari Vector2 objek, masing-masing menunjukkan posisi dari semua jari yang terlibat dalam gerakan.

rotation: number

Pengapung mengindikasikan seberapa banyak rotasi telah bergerak dari awal gerakan.

velocity: number

Pengapung yang menunjukkan seberapa cepat gerakan dilakukan.

Menunjukkan Enum.UserInputState dari gestur.


Contoh Kode

Touch Rotation

local innerFrame = script.Parent
local outerFrame = innerFrame.Parent
outerFrame.BackgroundTransparency = 0.75
outerFrame.Active = true
outerFrame.Size = UDim2.new(1, 0, 1, 0)
outerFrame.Position = UDim2.new(0, 0, 0, 0)
outerFrame.AnchorPoint = Vector2.new(0, 0)
outerFrame.ClipsDescendants = true
local dragging = false
local baseRotation = innerFrame.Rotation
local function onTouchRotate(_touchPositions, rotation, _velocity, state)
if state == Enum.UserInputState.Begin and not dragging then
dragging = true
baseRotation = innerFrame.Rotation
outerFrame.BackgroundTransparency = 0.25
elseif state == Enum.UserInputState.Change then
innerFrame.Rotation = baseRotation + rotation
elseif state == Enum.UserInputState.End and dragging then
dragging = false
outerFrame.BackgroundTransparency = 0.75
end
end
outerFrame.TouchRotate:Connect(onTouchRotate)

TouchSwipe

Acara TouchSwipe diaktifkan saat pemain melakukan gerakan geser di elemen UI menggunakan perangkat yang didukung sentuh. Ini diaktifkan dengan arah geser (Up, Down, Kiri atau Kanan) dan jumlah sentuh poin yang terlibat dalam geser. Geser geser sering digunakan untuk mengubah tab di UIs mobile.

Karena acara ini hanya mengharuskan satu jari, itu dapat dimulai di Studio menggunakan emulator dan mouse.

Parameter

swipeDirection: Enum.SwipeDirection

A Enum.SwipeDirection menunjukkan arah gerakan geser (Up, Down, Left atau Kanan).

numberOfTouches: number

Jumlah titik sentuh yang terlibat dalam gerakan ( biasanya 1).


Contoh Kode

Bouncing Color Picker

local frame = script.Parent
frame.Active = true
-- How far the frame should bounce on a successful swipe
local BOUNCE_DISTANCE = 50
-- Current state of the frame
local basePosition = frame.Position
local hue = 0
local saturation = 128
local function updateColor()
frame.BackgroundColor3 = Color3.fromHSV(hue / 256, saturation / 256, 1)
end
local function onTouchSwipe(swipeDir, _touchCount)
-- Change the BackgroundColor3 based on the swipe direction
local deltaPos
if swipeDir == Enum.SwipeDirection.Right then
deltaPos = UDim2.new(0, BOUNCE_DISTANCE, 0, 0)
hue = (hue + 16) % 255
elseif swipeDir == Enum.SwipeDirection.Left then
deltaPos = UDim2.new(0, -BOUNCE_DISTANCE, 0, 0)
hue = (hue - 16) % 255
elseif swipeDir == Enum.SwipeDirection.Up then
deltaPos = UDim2.new(0, 0, 0, -BOUNCE_DISTANCE)
saturation = (saturation + 16) % 255
elseif swipeDir == Enum.SwipeDirection.Down then
deltaPos = UDim2.new(0, 0, 0, BOUNCE_DISTANCE)
saturation = (saturation - 16) % 255
else
deltaPos = UDim2.new()
end
-- Update the color and bounce the frame a little
updateColor()
frame.Position = basePosition + deltaPos
frame:TweenPosition(basePosition, Enum.EasingDirection.Out, Enum.EasingStyle.Bounce, 0.7, true)
end
frame.TouchSwipe:Connect(onTouchSwipe)
updateColor()

TouchTap

Acara TouchTap diaktifkan ketika pemain melakukan gerakan gesek di elemen UI menggunakan perangkat yang mendukung sentuh (pemutar gesek akan menembakkan GuiObject.TouchLongPress , dan pemutar gesek akan menembakkan

Karena acara ini hanya mengharuskan satu jari, itu dapat dimulai di Studio menggunakan emulator dan mouse.

Parameter

touchPositions: Array

Sebuah matriks Vector2 yang menggambarkan posisi relatif dari jari-jari yang terlibat dalam gerakan.


Contoh Kode

Tap Transparency Toggle

local frame = script.Parent
frame.Active = true
local function onTouchTap()
-- Toggle background transparency
if frame.BackgroundTransparency > 0 then
frame.BackgroundTransparency = 0
else
frame.BackgroundTransparency = 0.75
end
end
frame.TouchTap:Connect(onTouchTap)