เทคนิคทำ BG ให้เคลื่อนที่ไปเรื่อยๆแบบเกม Side scrolling

background

สวัสดีครับ กลับมาพบกับเทคนิคการเขียนเกมด้วย Unity กันอีกครั้งนะครับ วันนี้เราผมก็มีเทคนิคดีๆมาฝากกันอีกเช่นเคย โดยในวันนี้ เราจะไปทำให้ Background ของเกม 2D เคลื่อนที่ไปเรื่อยๆแบบไม่มีวันจบครับ

เพื่อนๆบางคนน่าจะเคยทำเกม 2มิติมากันบ้างไม่มากก็น้อยนะครับ และเกมแนว 2d Side scrolling ก็เป็นแนวเกมที่นิยมทำกันเป็นอย่างมาก ซึ่งสิ่งที่ขาดไม่ได้เลยก็คือภาพแบคกราวที่จะเคลื่อนไปเรื่อยๆนั่นเองครับ  จริงๆแล้ว เทคนิคในการทำ BG ของเกมสองมิติแบบ Side scrolling นั้นมีหลายวิธีครับ แต่วันนี้ผมจะเอาวิธีที่ง่ายและเบสิคที่สุดมาฝากกัน ซึ่งในวันนี้เราจะไม่ใช้ UI Sprite ของ Unity แต่จะใช้ Quad แทนครับ

สิ่งแรกที่เราต้องเตรียมก็คือฉากหลังที่สามารถต่อกันสนิทนั่นเอง หมายความว่าขวาสุดของภาพจะต้องสามารถเชื่อมกับซ้ายสุดของภาพได้นั่นเองครับ ตัวอย่างแบบนี้ครับ

background

จากนั้นเราจะนำไปใส่ใน Asset folder ของเราครับ และทำการสร้าง Quad มา 1 ชิ้นครับ

01

จากนั้นเราจะลาก Background ของเราไปใส่ใน Quad ในหน้าต่าง Editor ครับ ซึ่ง Unity จะสร้างโฟลเดอ Material มาให้เราโดยอัตโนมัติครับ

02

มาปรับขนาด Quad ของเราให้พอดีกับหน้าจอกันหน่อยครับ

03

เนื่องด้วย Quad เป็น Object 3มิติ ดังนั้นเราต้องใส่แสงให้ครับ ถ้าดูมือให้เราหมุนมุมของแสงให้ส่อง Quad พอดีครับ

04

ทีนี้เราก็จะใส่สคริปให้กับ Quad กันครับ โดยผมจะให้ชื่อว่า ScrollScript

05

 

มาดูภายในสคริปกันครับ

 

06

 

 

 

public float speed = 0.5f;  – กำหนดตัวแปรเพื่อควบคุมความเร็วของแบคกราวครับ

Renderer rd; – ตัวแปรไว้เพื่ออ้างอิงถึง Texture ที่อยู่ใน Quad หรือ Background ของเรานั่นเอง

 

เก็บค่า Renderer ของ Quad ตัวนี้เอาไว้ในตัวแปรเพื่ออ้างอิงทีหลังครับ

void Start()

{

rd = gameObject.GetComponent<Renderer>();

}

 

ใน Loop Update จะเคลื่อนที่ Offset ของ Texture ไปท้ายซ้ายเรื่อยๆตามระยะเวลาที่ผ่านไปครับ เท่านี้ก็จะเหมือน Background ของเราเคลื่อนที่ไปเรื่อนๆแล้วครับ

void Update()

{

Vector2 offset = new Vector2(Time.time * speed, 0);

rd.material.mainTextureOffset = offset;

 

}

 

เป็นยังไงบ้างครับกับเทคนิคที่นำมาฝากกันในวันนี้ คงไม่ยากไปใช่ไม๊ล่ะครับ แล้วพบกันใหม่โอกาสหน้าครับ