---
# System prepended metadata

title: Day 20 | 3D蛇走迷宮AR遊戲開發Part1 場景放置、平面偵測
tags: [Unity, AR手遊]

---

# Day 20 | 3D蛇走迷宮AR遊戲開發Part1 場景放置、平面偵測
###### tags: `Unity` `AR手遊`

> **目錄**
> 遊戲機制
> FBX檔匯入設定
> 建模放置、布置場景
> 偵測平面手動放置場景物件

## 遊戲機制
偵測到平面後，放置迷宮與小妖怪肥遺，操縱介面上的按鈕，幫助肥遺走出迷宮。

使用到的素材


|肥遺(3D模型) | 石頭(3D模型) | 石頭(3D模型) | 石頭(3D模型) |
| -------- | -------- | -------- | -------- |
| ![](https://i.imgur.com/V9cSRKU.png)|![](https://i.imgur.com/jxpObch.png)|  ![](https://i.imgur.com/hUDlr6w.png)|  ![](https://i.imgur.com/EiC572z.png)|



| 草(3D模型) | 草(3D模型) | 草(3D模型) | 地板(3D模型) |
| -------- | -------- | -------- | -------- |
|   ![](https://i.imgur.com/X3yNqZf.png) | ![](https://i.imgur.com/UYzQHsh.png)| ![](https://i.imgur.com/KToPdfA.png)| ![](https://i.imgur.com/vVR1RqS.png)|





## FBX檔匯入設定
在之前的文章中有提到3D建模匯入專案的要點，其中提到FBX會打包3D建模的材質、貼圖等，在丟進Unity後，會發現檔案的材質是顯示none，如果丟進場景中，建模會顯示全灰白色，需要將材質從FBX檔提取出來才能使用。

![](https://i.imgur.com/BhzagV2.png)

在Project視窗中點擊FBX檔案，在視窗inspector中點選檔案的Material，點擊Extract Material，將材質從檔案中提取出來，儲存在存放材質的資料夾中。

![](https://i.imgur.com/1VRJ8fp.png)

原本顯示沒有None Material的建模，材質會自動被放到建模上，這時候建模物件就會正常顯示了。

![](https://i.imgur.com/W6qH6rm.png)

## 建模放置，場景布置

遊戲開始時，會將場景包含要操作的肥遺、介面、布景，手動放置到平面上，所以須將所有的物件打包成一個Prefab後一次放置。ARCore與ARKit套件，在AR世界是以公尺為單位，在美術製作建模時，如果物件大小設定為1公尺，且在Unity當中Scale為1，在鏡頭裡物件就會以1公尺呈現在環境中。

需事先與美術溝通好尺寸，方便之後進入Unity布置時可以做調整。布置迷宮時，擺放物件，間隔、大小不一，可以更自然呈現。擺放注意迷宮的Rotation以及Scale，基本上就沒甚麼問題了。迷宮、肥遺、介面都布置好以後，放入Empty Object裡頭，最後製作成一個Prefab，之後方便擺放在鏡頭中。


## 偵測平面手動放置場景物件

在之前的小遊戲中，有提到過平面偵測，這次一樣也需要添加AR PlaneManager元件，但改由手動放置物件。

* 宣告一個bool變數，用來記錄是否可手動放置，避免重複放置物件
* Input.touchCount > 0 判斷是否有螢幕接觸
* Input.GetTouch(0).phase == TouchPhase.Began 判斷手指剛觸摸到屏幕的時候
* 最後只要放置過物件後，就把放置器關掉囉!


```
void Update()
{
    
    if(Input.touchCount > 0 && Input.GetTouch(0).phase == TouchPhase.Began){
    List<ARRaycastHit> hits = new List<ARRaycastHit>();
    raycastManager.Raycast(Input.GetTouch(0).position, hits, UnityEngine.XR.ARSubsystems.TrackableType.Planes);
    if (hits.Count > 0)
        {
            GameObject.Instantiate(obiectToPlace, hits[0].pose.position, hits[0].pose.rotation);
            gameObject.SetActive(false);
        }
    }
    
    
    
}
```



---

以上就是手動放置迷宮場景實作部分，那之後就會進入蛇的移動囉，我們明天見~








