2-3 Enemy Floating Health Bar

請先下載課程提供的Enemy Health Bar v.2.unitypackage
https://drive.google.com/open?id=1Q6pn14JVW4Q6ut9Yhgw9HaAECKqccieL

本章實作敵人頭頂上的血條，同樣讓我們來匯入package內容。

匯入之後，讓我們看看Enemy Canvas的內容，首先大家可以看見Canvas的Render Mode是World Space，什麼意思呢？

大家可以嘗試先把Enemy Canvas拖入場景中，就會發現這個UI跟上一篇文章介紹的UI長的不同，他是放在『場景中』的。

接著，一樣需要新增一個Enemy.cs檔案，然後撰寫一段跟Player.cs相似的程式碼，並將Enemy.cs拖曳到Enemy中：

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Enemy : MonoBehaviour {

 [SerializeField] float maxHealthPoints = 100f;

 float currentHealthPoint = 100f;

 public float healthAsPercentage{
  get{ return currentHealthPoint / maxHealthPoints; }
 }
}

然後我們於Enemy底下建立一個空的GameObject。

 取名為UI Socket，這個物件的位置是我們要定位Health Bar用的。

所以，我們要在場景中將UI Socket的位置移動到Enemy的頭頂上。

再來把EnemyUI.cs拖曳到UI Socket中，並把Enemy Canvas的prefab拖曳到EnemyUI.cs的變數中。

接下來我們就來看Enemy UI做了什麼事？

using UnityEngine;

// Add a UI Socket transform to your enemy
// Attack this script to the socket
// Link to a canvas prefab that contains NPC UI
public class EnemyUI : MonoBehaviour {

    // Works around Unity 5.5's lack of nested prefabs
    [Tooltip("The UI canvas prefab")]
    [SerializeField]
    GameObject enemyCanvasPrefab = null;

    Camera cameraToLookAt;

    // Use this for initialization 
    void Start()
    {
        cameraToLookAt = Camera.main;
 //載入Enemy UI 的prefab，產生位置設定為UI Socket的位置
        Instantiate(enemyCanvasPrefab, transform.position, Quaternion.identity, transform);
    }

    // Update is called once per frame 
    void LateUpdate()
    {
 //設定UI的方向為面對Camera照過來的方向
        transform.LookAt(cameraToLookAt.transform);
        transform.rotation = Quaternion.LookRotation(cameraToLookAt.transform.forward);
    }
}

大家可以看到Enemy頭上的血條呈現一個很詭異的歪斜狀態，但實際上是因為我們把UI調整到可以面向Camera照過來的方向的關係。

 所以，實際在遊戲中，我們應該會看到的是如下圖的模樣。