3Dゲームを作っていると、キャラクターの頭上に HPバー・名前・吹き出しなどのUI を表示したい場面って多いですよね？
3D空間内の任意のオブジェクトに UI をスクリーン座標で追従表示する方法について解説します。
スクリプト
using UnityEngine;
public class WorldUI : MonoBehaviour {
public GameObject ui; // 表示させたいUI
public GameObject uiPrefab; // prefabを表示させる場合
public Canvas canvas; // UIを配置するキャンバス
public float followSpeed = 100f; // 追従スピード
private Camera mainCamera;
private Transform target;
private RectTransform rectTransform;
private Vector3 worldOffset;
public void Start() {
target = transform;
mainCamera = Camera.main;
worldOffset = Vector3.up * 2.0f;
if(uiPrefab != null) ui = Instantiate(uiPrefab, canvas.transform);
rectTransform = ui.GetComponent<RectTransform>();
}
public void LateUpdate() {
UpdateUIPosition();
}
// UIの位置更新
private void UpdateUIPosition() {
Vector3 worldPosition = target.position + worldOffset;
Vector3 screenPosition = mainCamera.WorldToScreenPoint(worldPosition);
rectTransform.position = Vector3.Lerp(rectTransform.position, screenPosition, Time.deltaTime * followSpeed);
}
}Code language: HTML, XML (xml)使い方
①Canvas を作成（Screen Space - Overlay に設定）
その中に表示したい UI（例：名前ラベルやHPバー）を作成。
完成したUIを プレハブ化またはシーン内に配置。
②スクリプトをアタッチ
１、スクリプトをUIを表示させたいオブジェクトにアタッチ。
２、UIを配置したいCanvasと表示するUIをアタッチ。
※PrefabのUIを使いたいならUIPrefabにアタッチします。
こんな感じならOKです！
追従するスピードはお好みで変えてください。
UpdateUIPosition() の中身
private void UpdateUIPosition() {
Vector3 worldPosition = target.position + worldOffset;
Vector3 screenPosition = mainCamera.WorldToScreenPoint(worldPosition);
rectTransform.position = Vector3.Lerp(rectTransform.position, screenPosition, Time.deltaTime * followSpeed);
}Code language: JavaScript (javascript)Vector3 worldPosition = target.position + worldOffset;
オブジェクトの頭上に UI を表示するためのワールド座標を計算します。
Vector3 screenPosition = mainCamera.WorldToScreenPoint(worldPosition);
ワールド座標を画面上の座標に変換します。
rectTransform.position = Vector3.Lerp(rectTransform.position, screenPosition, Time.deltaTime * followSpeed);
UIの位置を滑らかに補間しながら画面座標に追従させます。Lerp を使うことでふわっとついてくるような自然な動きになります。
完成！
プレイヤーの移動に合わせてUIが頭上を追従するようになりましたね！
コメント