狠狠撸

2D移動與碰撞處理II
Revised on October 10, 2019
? 使用剛體、碰撞器與觸發器
? 遊戲圖層及碰撞管理
? 探險遊戲關卡設計

? 剛體是具物理性質的元件，可使物件在物理引擎控制下擬真運動
? 由選單命令Component> Physics 2D> Rigidbody 2D為物件套用2D
剛體元件
? 物理性質：質量(Mass)、移動阻力( Linear Drag)、旋轉阻力(Angular
Drag)、重力(Gravity Scale)
? 運動剛體(Kinematic)不受重力及外力影響
? 埸景中的活動物件可使用剛體來實現
? 真實世界兩個物體撞在?起會發?碰撞，遊戲世界裡要透過碰撞器來
模擬現實世界的碰撞情形
? 碰撞器像是包覆在物件上的透明防護罩，代表物件實體邊界
? 加了碰撞器之剛體物件會被其它碰撞器阻隔
剛體、碰撞器與觸發器 1/5
2

? 我們可依物件外觀，由選單命令Component> Physics 2D中選用合適
的碰撞器
? Box Collider 2D(方框碰撞器)
? 適用於矩形物體
? Circle Collider 2D(圓形碰撞器)
? 適用於圓形物體
? Edge Collider 2D(邊緣碰撞器)
? 適用於邊界、地板或天花板
? 可編輯/調整線段節點，即使編輯成封閉迴路，也只有在線段上才會碰
撞，其內部不會產?碰撞
3
Circle Collider
Box Collider

? Polygon Collider 2D(多邊形碰撞器)
? 能較精準貼近不規則物體，但耗用較多運算資源
? Capsule Collider 2D(膠囊碰撞器)
? 適用於膠囊形狀物體
? Composite Collider 2D(複合碰撞器)
? 用來將子物件的碰撞器(Box Collider 2D及Polygon Collider 2D)
合併成?個碰撞器
? 子物件勾選Used By Composite
? 會自動附加Rigidbody 2D元件
4
Polygon Collider Capsule Collider
Composite Collider 2D
Polygon Collider
Box Collider

? 兩個具有碰撞器之物件相互碰觸時，程式腳本可以實作
OnCollisionXXX2D函式來處理碰撞作業
void OnCollisionEnter2D (Collision2D other) {
//進入碰撞時
}
void OnCollisionStay2D(Collision2D other) {
//在碰撞物上時
}
void OnCollisionExit2D(Collision2D other) {
//結束碰撞時
}
5

? 觸發器
? 當碰撞器被設定Is Trigger屬性，即成為觸發器；其它碰撞器物件可以穿
過觸發器物件
? 通常道具元件會加上觸發器
? 在物件之程式腳本可使用下列函式來處理碰撞事件
void OnTriggerEnter2D(Collider2D other) {
//進入碰撞範圍時
}
void OnTriggerStay2D(Collider2D other) {
//在碰撞物上時
}
void OnTriggerExit2D(Collider2D other) {
//脫離碰撞範圍時
}
6

? 更新座標方式 (自行計算位移，物體移動?硬不自然)
transform.Translate (Vector3.up * 0.1f);
transform.Translate (Vector3.down * 0.1f);
transform.Translate (Vector3.right * 0.1f);
transform.Translate (Vector3.left * 0.1f);
? 對剛體物件施力，由物理引擎處理剛體物件移動
rigidbody2D = this.GetComponent<Rigidbody2D> ();
Vector2 force2D = Vector2.zero;
force2D.y += forceValue;
// force2D.x += forceValue;
rigidbody2D.AddForce (force2D);
遊戲物件移動控制
7

遊戲圖層及碰撞管理 1/4
8
? 預設場景上的物件都是放置在Default圖層
? Layer用來做遊戲物件碰撞管理
? Sorting Layer用來管理場景物件前後層次
? 同Sorting Layer之物件，Order in Layer
數值較大者在上層；若Order in Layer值也
相同，則由Position Z值(與Main Camera
遠近)決定
? Layer屬性與Sorting Layer屬性二者並不相關

? 管理圖層
? 選單命令Edit> Project Settings> Tags and Layers管理圖層
? 在Sorting Layers增加Background、Interactive、Player圖層
9
下層
上層新增圖層

? 將在Sorting Layers中加入的圖層，同步更新到Layers清單中
10

? 碰撞管理
? 選單命令Edit> Project Settings> Physics 2D進行碰撞管理
? 設定Layer Collision Matrix
? 預設全部圖層間都會進行碰撞檢測處理
? 依據遊戲設計需求，設定圖層間的碰撞檢核
11

? 忍者可左、右移動、跳躍及射飛標
? 忍者必須先射飛標消滅飛龍，才能躍過山溝
? 忍者接觸到毒霧會受傷
? 忍者靠近寶箱時會顯示提示箭頭，此時按空白鍵可開啟寶箱
探險遊戲關卡設計
12

? 新增2D遊戲專案，將預設場景以main名稱存檔
? 在Assets下建立以下資料夾
? Animations
? Prefabs
? Scripts
? Sprites
? SpritesNinja
建立遊戲專案 1/2
13

? 將忍者動作分鏡圖匯入到AssetsSpritesNinja資料夾
? 將background.png、trap0.png、trap1.png、trap2.png、
tresure0.png、treasure1.png、up.png、dragon.png素材滙入到
AssetsSprites資料夾
? Main Camera
? Size設定為16
建立遊戲專案 2/2
14

? 選單命令Edit> Project Settings> Tags and Layers
? 在Sorting Layers增加Background、Interactive、Player圖層
? 在Layers加入Background、Interactive、Player圖層
建立遊戲圖層 1/2
15

? 設定圖層碰撞關係
? 選單命令Edit> Project Settings> Physics 2D進行碰撞管理
? 設定Layer Collision Matrix，啟用以下碰撞檢核
? Player與Backgound
? Player與Interactive
建立遊戲圖層 2/2
16

? 將background.png拖曳到場景，命名為Background
? Position(X,Y,Z) = (48.5, 0, 0)
? Scale(X,Y,Z) = (8, 8, 1)
? Layer = Background
? Sorting Layer = Background
? 設定地面邊界
? 選單命令Component> Physics 2D> Edge Collider 2D加入邊緣碰
撞器
? 點擊Edit Collider編輯邊緣碰撞器，使其貼齊山谷左側地面
? 選單命令Component> Physics 2D> Edge Collider 2D加入邊緣碰
撞器
? 點擊Edit Collider編輯邊緣碰撞器，使其貼近貼齊山谷右側地面
建造背景及地面邊界
17

? 點選AssetsSpritesdragon
? Sprite Mode = Multiple
? 點擊Sprite Editor
? 套用自動分割，並調整每個分鏡圖片座標基準點(Pivot)到胸口位置
建立飛龍 1/4
18
Pivot

? 將dragon_0.png拖曳到場景，命名為Dragon
? Position(X,Y,Z) = (-3.5, -4, 0)
? Rotation(X,Y,Z) = (0, 180, 0)
? Scale(X,Y,Z) = (3, 3, 1)
? Layer = Interactive
? Sorting Layer = Interactive
? 設定碰撞器
? 選單命令Component> Physics 2D> Circle Collider 2D加入圓形
碰撞器
建立飛龍 2/4
19

? 製作飛龍動畫
? 選單命令Window> Animation> Animation開啟動畫編輯器，使用
dragon分鏡素材建立編輯飛龍動畫
建立飛龍 3/4
20

? 加入Dragon程式腳本，飛龍被飛標擊中會損血，?命值歸零時消失
public class Dragon : MonoBehaviour {
[SerializeField]
private int life = 3;
// Use this for initialization
void Start () {
}
// Update is called once per frame
void Update () {
}
void OnTriggerEnter2D(Collider2D c) {
if (c.tag == "dart") life--;
if (life == 0) Destroy(this.gameObject);
}
}
建立飛龍 4/4
21

? 點選AssetsSpritesNinja忍者動作分鏡圖片
? Texture Type = Sprite(2D and UI)
? 透過Sprite Editor將所有忍者動作分鏡圖片的座標基準點(Pivot)
調整到角色雙腳底部重心位置
建立忍者角色 1/3
22
Pivot

? 將AssetsSpritesNinjaidle_000拖曳到場景，命名為Ninja
? Position(X,Y,Z) = (-26, -9, 0)
? Sorting Layer = Player
? Layer = Player
? 選單命令Component> Physics 2D> Rigidbody 2D加入剛體元件
? 勾選Use Auto Mass
? Gravity Scale = 1.5
? 勾選Freeze Rotation Z
? 選單命令Component> Physics 2D> Capsule Collider 2D加入膠囊碰
撞器
? 適當調整Offset(X, Y)及Size(X, Y)
23

? 製作角色動畫
選單命令Window> Animation> Animation開啟動畫編輯器，使用Ninja
分鏡素材建立以下動畫
? 建立ninja_idle動畫 (1秒)
? 建立ninja_run動畫 (0.5秒)
? 建立ninja_jump動畫 (1秒)
? 建立ninja_throw動畫 (1秒)
24

? 拖曳Kunai到場景中，命名為Dart
? Rotation(X,Y,Z) = (0, 0, -90)
? Layer = Player
? Sorting Layer = Player
? Tag = dart
? 選單命令Component> Physics 2D> Rigirbody 2D加入剛體
? Gravity Scale=0
? 選單命令Component> Physics 2D> Box Collider 2D加入矩形碰撞器
? 勾選Is Trigger
製作飛鏢預製物件 1/3
25

? 在Dart物件加上Dart程式腳本
public class Dart : MonoBehaviour{
//Use this for initialization
public float speed;
void Start(){
GetComponent<Rigidbody2D>().velocity = new Vector2(speed, 0.0f);
}
//Update is called once per frame
void Update(){
}
private void OnBecameInvisible(){ //飛出畫面
Destroy(this.gameObject);
}
void OnTriggerEnter2D(Collider2D c) { //射到其它物件
Destroy(this.gameObject);
}
}
26

? 將Dart之Speed欄位設為10
? 執行測試，飛標會向右射出，飛出場景時會
自動消失
? 測試無誤後，由Hierarchy面板將Dart物件
拖曳到Prefabs資料夾，做成預製物件
? 刪除場景上Dart物件
27

? 選單命令GameObject> Create Empty，更名為Dart Spawn
? Position(X,Y,Z) = (0, 0, 0)
? Rotation(X,Y,Z) = (0, 0, -90)
? Scale(X,Y,Z) = (1, 1, 1)
? Layer = Player
? 拖曳Dart Spawn成為Ninja子物件
? 調整Dart Spawn位置到Ninja之前端，Position(X,Y,Z) = (2.1, 2.15, 0)
設定飛鏢發射點
28

? 在Ninja物件加上NinjaController程式腳本
public class NinjaController : MonoBehaviour{
[SerializeField]
private GameObject dart;
[SerializeField]
private Transform dartSpawn;
private bool facingRight = true; //主角面向右旗號
...
public void ThrowDart(){
float speed;
speed = System.Math.Abs(dart.gameObject.GetComponent<Dart>().speed);
if (facingRight)
dart.gameObject.GetComponent<Dart>().speed = speed;
else
dart.gameObject.GetComponent<Dart>().speed = -speed;
Instantiate(dart, dartSpawn.position, dartSpawn.rotation);
}
}
飛鏢發射控制 1/3
29

? 拖曳AssetsPrefabsDart預製物件到Ninja Controller之Dart欄
? 拖曳Dart Spawn物件到Ninja Controller之Dart Spawn欄
30

? 修改ninja_throw動畫，在時間軸0:15處新增Animation Event，設
定ThrowDart()做為事件函式
31

? 選取Ninja物件
? 選單命令Window> Animator，開啟Animator編輯器
? 建立動畫狀態之間轉換
忍者狀態控制 1/7
32

? 建立?個名為action的Int參數
? 設定ninja_idle? ninja_run狀態切換條件
? 取消Has Exit Time
? Settings/Transtion Duration = 0
? 在Consitions中新增action Equals 1
? 設定ninja_idle? ninja_jump狀態切換條件
33

? 設定ninja_idle? ninja_throw狀態切換條件
? Settings/Transtion Duration設為0
? 在Consitions中新增Action Equals 3
? 設定ninja_run? ninja_idle狀態切換條件
34

? 設定ninja_jump? ninja_idle狀態切換條件
? 設定ninja_throw? ninja_idle狀態切換條件
? 勾選Has Exit Time
? Settings/Exit Time = 1
? Settings/Transtion Duration設為0
35

? 編輯NinjaController程式腳本
...
private bool facingRight = true; //主角面向右旗號
[SerializeField]
private int speed = 10; //移動速度
private Animator animator;
private Rigidbody2D rigid;
private Vector3 startPos;
private bool isJump = false; //主角跳躍旗號
void Start(){
animator = this.GetComponent<Animator>();
startPos = transform.position;
rigid = this.GetComponent<Rigidbody2D> ();
}
36

void Update() {
if (Input.GetKey (KeyCode.RightArrow)) {
facingRight = true;
this.transform.eulerAngles = Vector3.zero; //使主角面向右
this.transform.Translate (speed*Time.deltaTime, 0, 0); //主角向右移動
if (!isJump) PlayAnimation (1); //跑步動畫
} else if (Input.GetKey (KeyCode.LeftArrow)) {
facingRight = false;
this.transform.eulerAngles = new Vector3 (0, 180, 0); //使主角面向左
this.transform.Translate (speed*Time.deltaTime, 0, 0); //主角向左移動
if (!isJump) PlayAnimation (1); //跑步動畫
} else if (Input.GetKeyDown (KeyCode.UpArrow)) {
if (!isJump) {
rigid.velocity = new Vector2(rigid.velocity.x, rigid.velocity.y+speed);
isJump = true; //主角進入跳躍狀態
PlayAnimation (2); //跳躍動畫
}
} else if (Input.GetKeyDown (KeyCode.X)) PlayAnimation (3); //射飛鏢動畫
else if (!isJump) PlayAnimation (0); //閒置動畫
}
37

private void PlayAnimation(int action){
animator.SetInteger("action", action);
}
private void OnBecameInvisible(){
transform.position = startPos;
}
void OnCollisionEnter2D(Collision2D c) {
if (c.gameObject.name == "Background") { //主角接觸地板
isJump = false;
}
}
...
}
? 測試遊戲專案
38

? 將AssetsSpritestrap0拖曳到場景
? 命名為Trap
? Position(X,Y,Z) = (10, -11, 0)
? Rotation(X,Y,Z) = (0, 0, -3)
? Scale(X,Y,Z) = (0.6, 0.6, 1)
? Tag = trap
建立陷阱道具 1/2
39

? 選單命令Component> Physics 2D> Circle Collider 2D加入圓形碰
撞器
? 勾選「Is Trigger」屬性 (會偵測物體碰接，但允許剛體物件穿過)
? Offset Y = -2.25，讓碰撞邊界貼近陷阱外緣
建立陷阱道具 2/2
40

? 選取Trap物件
? 選單命令Window> Animation> Animation開啟動畫編輯器，使用trap
分鏡素材建立trap動畫
製作陷阱道具動畫
41

? 將AssetsSpritestreasures0拖曳到場景
? 命名為Treasure
? Position(X,Y,Z) = (24.5, -8, 0)
? Scale(X,Y,Z) = (0.6, 0.6, 1)
? Tag = treasure
建立寶箱道具 1/2
42

? 選單命令Component> Physics 2D> Box Collider 2D加入矩形碰撞器
? 勾選「Is Trigger」屬性
? 將up素材拖曳到treasure物件上，做為treasure的子物件
? 命名為up
? Position(X,Y,Z) = (0, 5, 0)
? Size(X,Y,Z) = (0.6, 0.6, 1)
建立寶箱道具 2/2
43

? 在Treasure物件加入TreasureControl程式腳本
public class TreasureControl : MonoBehaviour {
[SerializeField]
private Sprite open; //寶箱已開啟之Sprite圖片
public bool isOpen; //寶箱狀態
private bool isShow = false; //指示箭頭顯示旗號
private float alpha = 0.0f;
private float da = -0.01f;
private GameObject prompt;
private SpriteRenderer upSprite;
void Awake () {
prompt = GameObject.Find("up"); //指示箭頭物件參照
prompt.gameObject.SetActive (isShow); //隱藏指示箭頭
}
void Start () {
upSprite = prompt.GetComponent<SpriteRenderer> ();
}
設計寶箱程式腳本 1/4
44

void Update () {
if (isOpen) { //寶箱已被開啟
this.GetComponent<SpriteRenderer> ().sprite = open;
prompt.gameObject.SetActive (false); //隱藏指示箭頭
} else {
if (isShow) {
alpha += da; //使指示箭頭淡入淡出動態顯示
upSprite.material.color = new Color (1f, 1f, 1f, alpha);
if (alpha>1.0f || alpha<0.0f) da = -da;
}
}
45

void OnTriggerEnter2D (Collider2D c) { //玩家到達寶箱位置
if (c.gameObject.name == "Ninja") {
isShow = true;
prompt.gameObject.SetActive (isShow); //顯示指示箭頭
}
}
void OnTriggerExit2D (Collider2D c) { //玩家離開寶箱位置
if (c.gameObject.name == "Ninja") {
isShow = false;
prompt.gameObject.SetActive (isShow); //隱藏指示箭頭
alpha = 0.0f;
}
}
}
46

? 將AssetsSpritestreasures1素材(寶箱開啟圖片)拖曳到寶箱之
Treasure Control下的Open屬性
47

? 編輯NinjaController程式腳本，加入與陷阱及寶箱道具互動
...
private bool isJump = false; //主角跳躍旗號
private float alpha = 0.0f;
private float da = -0.1f;
private SpriteRenderer playerSprite;
private bool isInjure = false; //主角受傷旗號
void Start(){
...
rigid = this.GetComponent<Rigidbody2D> ();
playerSprite = this.GetComponent<SpriteRenderer> ();
}
更新忍者程式腳本 1/3
48

// Update is called once per frame
void Update () {
...
else if (!isJump) PlayAnimation (0);
if (isInjure) { //顯示主角受傷效果
alpha += da; //使主角淡入淡出顯示
playerSprite.material.color = new Color (1f, 1f, 1f, alpha);
if (alpha > 1.0f || alpha < 0.0f) da = -da;
}
}
49

void OnTriggerEnter2D(Collider2D c) {
if (c.gameObject.tag == "trap") { //主角碰到陷阱
isInjure = true; //主角為受傷狀態
}
}
void OnTriggerExit2D(Collider2D c) {
if (c.gameObject.tag == "trap") { //主角脫離陷阱
isInjure = false;
playerSprite.material.color = new Color(1f, 1f, 1f, 1f); //復原主角狀態
}
}
void OnTriggerStay2D (Collider2D c) {
if (c.gameObject.tag == "treasure") //主角在寶箱處
if (Input.GetKeyDown (KeyCode.Space)) //按下空白鍵取得寶藏
c.gameObject.GetComponent<TreasureControl>().isOpen = true;
}
}
50

? PlayerPrefs可以在應用程式內做資料存取的動作，可存取的資料型
態包括int、float、string三種類型
? 儲存資料
? PlayerPrefs.SetInt ("儲存名稱I", 整數變數);
? PlayerPrefs.SetFloat ("儲存名稱F", 浮點數變數);
? PlayerPrefs.SetString ("儲存名稱S", 字串變數);
? 讀取資料
? 整數變數 = PlayerPrefs.GetInt ("儲存名稱I");
? 浮點數變數 = PlayerPrefs.GetFloat ("儲存名稱F");
? 字串變數 = PlayerPrefs.GetString ("儲存名稱S");
設計儲存點 1/2
51

? 清除全部資料
? PlayerPrefs.DeleteAll();
? 清除個別變數資料
? PlayerPrefs.DeleteKey("儲存名稱I");
設計儲存點 2/2
52

狠狠撸

Unity遊戲程式設計 - 2D移動與碰撞處理II

Recommended

More Related Content

What's hot (20)

Similar to Unity遊戲程式設計 - 2D移動與碰撞處理II (20)

More from 吳錫修 (ShyiShiou Wu) (20)

Unity遊戲程式設計 - 2D移動與碰撞處理II