ซ่อน CanvasGameOver
คลิกที่แคนวาส จากนั้นไปที่หน้าต่าง Inspector ที่มุมบนซ้ายให้ติ๊กเครื่องหมายถูกออก
แสดง CanvasGameOver เมื่อเครื่องบินตาย
ไปที่ Script PlaneMovement ให้เพิ่มตัวแปรแคนวาสดังนี้ public Canvas _CanvasGameOver;เพื่อทำการอ้างถึงตัว CanvasGameOver จากนั้นลากออบเจ็ค CanvasGameOver มาใส่ดังภาพ
public void OnCollisionEnter2D(Collision2D collision)
{
_IsDead = true;
GetComponent<Animator>().SetBool("IsDead", true);
_CanvasGameOver.gameObject.SetActive(true);
}
หลังจากรันและทดสอบเกมจะเห็นว่าเมื่อเครื่องบินชนจะมี UI Game Over แสดงผลขึ้นมาโดยเล่นแอนิเมชั่นที่เราได้ทำการสร้างไว้ก่อนหน้านี้ด้วย
เริ่มเกมใหม่ด้วย LoadLevel
สร้าง C# Script ขึ้นมาใหม่ ในที่นี้ตั้งชื่อว่า UI จากนั้นสร้างฟังก์ชั่น Retry สำหรับทำหน้าที่ในการเริ่มเกมใหม่ ดังนี้public class UI : MonoBehaviour
{
public void Retry()
{
Application.LoadLevel("Game");
}
}
คำสั่ง Application.LoadLevel("Game"); จะทำหน้าที่ในการโหลดซีนที่มีชื่อว่า "Game" ขึ้นมาใหม่ ให้ใส่ชื่อซีนที่ต้องการเข้าไป
กรณีผู้อ่านใช้ Unity 5.3 ขึ้นไปให้ใช้ SceneManager.LoadScene("Game") แทน
จากนั้นที่เกมออบเจ็ค CanvasGameOver ให้เพิ่ม Component UI Script เข้าไป
เมื่อใส่เกมออบเจ็ค CanvasGameOver เรียบร้อยแล้ว ให้คลิกที่ No Function จะเห็นว่ามีป๊อปอัพขึ้นมา ให้เลือก UI จากนั้นเลือกฟังก์ชั่น Retry()
UI Game Start
สร้างเกมออบเจ็ค Canvas ขึ้นมาใหม่ ในที่นี้จะตั้งชื่อให้เป็น CanvasStart จากนั้นตั้ง Reference Resolution X เป็น 1280 และ Y เป็น 720
คลิกเพื่อเริ่มเกม
เมื่อลองรันเกมดูจะเห็นว่าเกมจะเริ่มเล่นทันที ส่วน UI Game Start จะขึ้นมาตั้งแต่เริ่มรันซีน และยังอยู่ในขณะที่เล่นเกมจนกระทั่งจบเกมดังนั้นในส่วนนี้เราจะมาเขียนโค้ดให้แสดง UI Start Game และตัวเครื่องบินจะต้องยังไม่เริ่มบินทันทีในตอนเริ่มต้น แต่เมื่อผู้เล่นทำการคลิกเราจะทำการซ่อน UI Start Game และสั่งให้เครื่องบินบิน
เปิด Script PlaneMovement ขึ้นมา
สร้างตัวแปรสำหรับเช็คว่าเกมเริ่มหรือยัง โดยใช้ค่าเริ่มต้นเป็น false
private bool _IsStart = false;
สร้างฟังก์ชั่น Start() ขึ้นมาใช้สำหรับกำหนดค่าเริ่มต้นให้ค่า isKinematic เป็น true ซึ่งหมายความว่า Collision และ Rigidbody จะไม่ส่งผล ทำให้เครื่องบินไม่บินตกลงไปตามแรงโน้มถ่วง
private void Start()
{
GetComponent<Rigidbody2D>().isKinematic = true;
}
ในฟังก์ชั่น Update() เพิ่มการเช็ค _IsStart ถ้าเกมเริ่มแล้วถึงจะให้เครื่องบินบินไปทางขวา
private void Update()
{
if (_IsDead) return;
if (_IsStart)
{
Vector3 pos = new Vector3(_Speed, 0, 0);
transform.position += pos;
}
if (Input.GetMouseButtonDown(0))
{
GetComponent<Rigidbody2D>().AddForce(new Vector2(0, 1) * _TabSpeed);
}
}
ทดลองรันเกมจะเห็นได้ว่า เมื่อเริ่มเกมเครื่องบินจะหยุดอยู่กับที่ และแสดง UI Game Start เรียบร้อย
จากนั้นเราจะมาทำให้เมื่อเกิดการคลิกเกิดขึ้นให้ซ่อน UI Game Start และให้เครื่องบินตามปกติ ดังนี้
สร้างตัวแปร public Canvas เพื่อใช้อ้างอิงถึง UI Game Start
public Canvas _CanvasGameStart;
เลือกที่เกมออบเจ็ค Plane ที่ PlaneMovement Script จะเห็นว่ามี Canvas Game Start ขึ้นมา ให้ลากเกมออบเจ็ค CanvasGameStart ที่เราทำการสร้างเอาไว้ก่อนหน้านี้มาใส่
_CanvasGameStart.gameObject.SetActive(true);
จะได้ดังนี้
private void Start()
{
GetComponent<Rigidbody2D>().isKinematic = true;
_CanvasGameStart.gameObject.SetActive(true);
}
ในฟังก์ชั่น Update() ตรงส่วนการเช็คอีเว้นท์คลิกให้ทำการแก้ไขดังนี้
if (Input.GetMouseButtonDown(0))
{
if (!_IsStart)
{
_CanvasGameStart.gameObject.SetActive(false);
GetComponent<Rigidbody2D>().isKinematic = false;
_IsStart = true;
}
else
{
GetComponent<Rigidbody2D>().AddForce(Vector2.up * _TabSpeed);
}
}
หมายความว่าถ้าเกมยังไม่เริ่มและมีการคลิกเกิดขึ้น โปรแกรมจะวิ่งเข้าไปทำโค้ดดังต่อไปนี้
_CanvasGameStart.gameObject.SetActive(false); //ซ่อน UI Game Start
GetComponent<Rigidbody2D>().isKinematic = false; //กำหนดให้ Collision และ Rigidbody มีผลต่อเกมออบเจ็คนี้
_IsStart = true; //ให้ตัวแปรเช็คเป็น true แสดงว่าเกมเริ่มแล้ว
หลังจากเกมเริ่มแล้วและผู้เล่นได้ทำการคลิกจะทำให้โปรแกรมลงมาทำงานที่บรรทัดดังต่อไปนี้
GetComponent<Rigidbody2D>().AddForce(Vector2.up * _TabSpeed); //ให้เครื่องบินบินขึ้นเมื่อมีการคลิก
ลองทดสอบโดยการรันและเล่นเกมจะเห็นว่าเราได้ UI เกมครบ Flow แล้ว คือ
- แสดง UI Game Start
- คลิกเพื่อเริ่มเกม -> ซ่อน UI Game Start -> เกมเริ่มเล่น
- เมื่อตาย แสดง UI Game Over
- คลิก Retry -> ซ่อน UI Game Over -> โหลดเกมใหม่
