ส่วนใหญ่ Mask Component จะใช้ร่วมกับ Scroll Rect Component เพื่อให้เราสามารถเลื่อนวัตถุที่ถูก Mask (กรณีมีขนาดใหญ่เกินกว่า Mask) ซึ่งในส่วนของ Mask เองนั้นก็ต้องใช้ร่วมกลับ Image Component
เริ่มกันเลยครับ
1. ให้เราทำการสร้าง Panel และทำการ Add Mask Component โดยไปที่ Component => UI => Mask
2. จากนั้นให้เราทำการสร้าง Image โดยให้เป็น Child ของ Panel ในข้อที่ 1 ดังรูป
5. จากนั้นให้เราทำการเลือก Panel แล้วเพิ่ม Scroll Rect Component โดยไปที่ Component => UI => Scroll Rect
6. ทำการลาก Image ไปที่ Content ของ Scroll Rect ดังภาพ
Content : สำหรับกำหนดว่า Object ตัวไหนสามารถที่จะเลื่อนได้
Horizontal : กำหนดให้ Content สามารถเลื่อนแนวนอนได้
Vertical : กำหนดให้ Content สามารถเลื่อนแนวตั้งได้
Movement Type : รูปแบบในการเลื่อน Content
- Unrestricted : เลื่อนได้โดยไม่สนใจขนาดของ Panel (ไม่จำกัดความกว้างและสูง)
- Elasticity : เมื่อเลื่อนเกินขอบเขตของ Panel จะทำการเด้งกลับ
- Clamped : ไม่สามารถเลื่อนเกินขอบเขตของ Panel ได้เลย
- Deceleration Rate : rate ในการหน่วงของ Inertia
Horizontal Scrollbar : UI สำหรับ Horizontal Scrollbar
Vertical Scrollbar : UI สำหรับ Vertical Scrollbar
7. จากนั้นทำการ Run และทดสอบได้เลยครับ แนะนำว่าลองเล่นกับตัวแปรต่างๆ ดูครับ
เท่านี้ก็สามารถนำไปประยุกต์ใช้ในเกมได้แล้วครับ
ปล. มีอะไรแนะนำมาได้ครับ
NO GAME NO DREAM!!!!