ปุ่มข้อความและรูปภาพ

ปุ่ม เป็น GuiObjects ที่ช่วยให้ผู้ใช้สามารถดำเนินการได้ คุณสามารถปรับแต่งปุ่มเพื่อให้ข้อมูลเชิงบริบทและฟีดแบค เช่น การเปลี่ยนลักษณะทางกายภาพหรือ การเขียนสคริปต์ ฟีดแบคเสียงเมื่อผู้คลิกปุ่ม

มีสองประเภทของปุ่มที่คุณสามารถวาง บนหน้าจอ หรือตลอดระยะเวลาประสบการณ์ ในประสบการณ์:

• TextButton เป็นสี่เหลี่ยมผืนผ้าที่มีข้อความซึ่งกระตุ้นเหตุการณ์ Activated เมื่อมีการคลิก/แตะ

• ImageButton เป็นสี่เหลี่ยมผืนผ้าที่มีภาพซึ่งกระตุ้นเหตุการณ์ Activated เมื่อมีการคลิก/แตะ มันมีสถานะเพิ่มเติมสำหรับการสลับภาพเมื่อผู้ใช้วางเมาส์เหนือหรือตั้งไว้

สร้างปุ่มบนหน้าจอ

ปุ่มบนหน้าจอมีประโยชน์ในการชี้นำผู้ใช้ไปยังเมนูหรือหน้าต่างต่างๆ ได้อย่างรวดเร็ว

ในการเพิ่มปุ่มไปยังหน้าจอ:

1. ในหน้าต่าง Explorer ให้เลือก StarterGui และเพิ่ม ScreenGui

   1. นำเมาส์ไปจ่าหน้าสำหรับ StarterGui และคลิกที่ปุ่ม ⊕ เมนูบริบทจะแสดงออกมา

   2. แทรก ScreenGui

2. เลือก ScreenGui ใหม่และเพิ่มปุ่ม

   1. นำเมาส์ไปจ่าหน้าสำหรับ ScreenGui และคลิกที่ปุ่ม ⊕ เมนูบริบทจะแสดงออกมา

   2. แทรก TextButton หรือ ImageButton

   

สร้างปุ่มบนหน้าผิวของพาร์ท

ปุ่มบนหน้าผิวของพาร์ทมีประโยชน์ในการอนุญาตให้ผู้ใช้มีปฏิสัมพันธ์กับพาร์ท ตัวอย่างเช่น คุณสามารถให้ผู้ใช้เหยียบปุ่มเพื่อทำการกระทำ

ในการเพิ่มปุ่มไปยังหน้าผิวของพาร์ท:

1. ในหน้าต่าง Explorer ให้เลือก part และเพิ่ม SurfaceGui

   1. นำเมาส์ไปจ่าหน้าสำหรับ part และคลิกที่ปุ่ม ⊕ เมนูบริบทจะแสดงออกมา

   2. แทรก SurfaceGui

2. เลือก SurfaceGui ใหม่และเพิ่มปุ่มหรืออินพุตประเภทใดก็ได้

   1. นำเมาส์ไปจ่าหน้าสำหรับ SurfaceGui และคลิกที่ปุ่ม ⊕ เมนูบริบทจะแสดงออกมา

   2. แทรก TextButton หรือ ImageButton

   

   หากคุณไม่เห็นปุ่ม ลอง เลือกหน้าที่แตกต่างกัน ในคุณสมบัติ Face ของ SurfaceGui

เปลี่ยนลักษณะของ ImageButton

การเปลี่ยนลักษณะของ ImageButton เมื่อผู้ใช้มีปฏิสัมพันธ์กับมันจะให้ฟีดแบคทางกายภาพที่มีประโยชน์ ตัวอย่างเช่น เมื่อ ImageButton เปลี่ยนลักษณะทางกายภาพเมื่อผู้ใช้วางเมาส์เหนือ มันจะแจ้งให้ผู้ใช้ทราบว่ามันไม่ได้ถูกปิดใช้งานและว่าพวกเขามีตัวเลือกในการคลิกหากพวกเขาต้องการทำการกระทำของ ImageButton

ImageButton มีคุณสมบัติสามอย่างในการเปลี่ยนลักษณะทางกายภาพ:

• Image - ภาพที่แสดงเมื่อผู้ใช้ไม่ได้มีปฏิสัมพันธ์กับ ImageButton

• HoverImage - ภาพที่แสดงเมื่อผู้ใช้กำลังเลื่อนเมาส์เหนือ ImageButton

• PressedImage - ภาพที่แสดงเมื่อผู้ใช้คลิกที่ ImageButton

ในการเปลี่ยนลักษณะของ ImageButton ด้วยการนำเข้าของผู้ใช้:

1. เพิ่ม ImageButton ไปยัง หน้าจอ หรือ พื้นผิว

2. ในหน้าต่าง Explorer ให้คลิกที่วัตถุ ImageButton

3. ในหน้าต่าง Properties ให้กำหนด ID สินทรัพย์ที่แตกต่างกันสามรายการสำหรับคุณสมบัติ Image, HoverImage, และ PressedImage

สคริปต์ปุ่ม

คุณสามารถเขียนสคริปต์เพื่อทำการกระทำเมื่อผู้ใช้กดปุ่มโดยการเชื่อมต่อปุ่มกับเหตุการณ์ GuiButton.Activated ตัวอย่างเช่น เมื่อคุณนำ LocalScript ต่อไปนี้ไปยังปุ่ม ปุ่มจะแสดงสีแบบสุ่มทุกครั้งที่ผู้ใช้คลิกที่มัน

local button = script.Parent
local RNG = Random.new()
local function onButtonActivated()
	-- ทำให้สีของปุ่มสุ่ม
	button.BackgroundColor3 = Color3.fromHSV(RNG:NextNumber(), 1, 1)
end
button.Activated:Connect(onButtonActivated)