Unity 튜토리얼: 배틀 시스템의 캐릭터 UI 체력 바 디자인

순서

게임을 하다보면 가끔씩 건강바, 즉 건강가치에 주의를 기울이게 됩니다.

게임 내 체력바[HP]는 어떻게 되나요?

 함께 소통하고 배울 수  있는 학습교류반 이 있습니다.

1: 기술 솔루션을 선택하는 방법

Unity 전투 시스템에서 각 캐릭터는 종종 체력 표시줄과 닉네임을 가지고 있습니다. 아키텍처 설계가 효율적인 방법에 대해 몇 가지 일반적인 사례를 나열합니다.

  1. 닉네임과 건강 바를 만드는 onGUI;
  2. 3D 세계에서 3D 개체를 만들어 건강 막대와 별명을 만든 다음 건강 막대와 별명이 카메라를 향하도록 합니다.
  3. UGUI/NGUI를 기반으로 체력 바의 UI 노드와 닉네임을 별도로 만든 다음 UI 노드의 위치를 ​​캐릭터와 동기화합니다.
  4. 기타 가능한 관행;

방식 (1)에서 onGUI의 성능은 매우 열악하며 일반적으로 일부 디버깅 관련 정보를 표시하는 데만 사용되며 형식적인 게임 개체에는 적합하지 않습니다. 스킴 (2)에서는 3D 오브젝트를 생성한 후 카메라를 향하여 기능을 구현할 수 있는데 블러드 바의 별명과 같은 오브젝트가 오브젝트의 일괄 처리를 방해하여 드로콜을 생성할 수 있다는 문제점이 있다. 상대적으로 높고, 닉네임의 셰이더와 블러드바도 캐릭터와 다를 수 있으며, 셰이더를 지속적으로 전환하여 베이스 콜이 폭발할 위험이 있습니다. 따라서 공식 프로젝트에서는 (3)의 UGUI/NGUI를 사용하여 체력바와 닉네임의 UI 노드를 별도로 생성한 후 캐릭터가 이동하고 동기화된 UI 노드의 위치가 업데이트 됩니다. 동시에.

이런 식으로 캐릭터가 가는 곳마다 혈흔과 닉네임이 따라옵니다. 모든 체력 바와 닉네임은 UGUI의 한 노드 아래에 있으며, 많은 캐릭터가 싸울 때 이러한 체력 바와 닉네임을 일괄적으로 그려서 드로콜을 최대한 줄일 수 있습니다. 계획이 확정되면 이 아이디어를 바탕으로 구현하게 되는데 역할과 체력 바를 어떻게 관리할 것인가, 역할과 체력 바의 위치를 ​​어떻게 동기화할 것인가라는 두 가지 큰 문제를 해결해야 한다.

2: 캐릭터 노드 및 UI 체력 바 정렬 방법

3D 캐릭터 아트 모델링이 완료되면 프로그램에서 프로젝트로 가져오고 또 다른 매우 중요한 것은 캐릭터에 3D 노드 mountPoint를 추가하는 것입니다.화면에서 이 노드의 위치는 화면의 UI 블러드 바입니다. 위치, 이것은 중요합니다. 많은 학생들이 혼란스러워 할 것입니다. 문자 위치 + 고정 오프셋이면 충분합니다. 왜이 점이 필요합니까? 3D 게임은 2D 게임과 다르기 때문에 화면에서 3D 게임 오브젝트의 위치는 자신과 관련이 있을 뿐만 아니라 카메라 각도와도 관련이 있어 위치에 직접 오프셋을 추가할 수 없으며, 그러나 3D 캐릭터에 오프셋을 추가하려면 그림과 같이 적절한 3D 포인트, 화면에서 이 포인트의 위치가 UI 헬스 바 및 닉네임의 위치입니다.

mountPoint의 좌표가 화면 좌표로 전달된 후 UI 헬스바와 닉네임이 위치한 화면 위치입니다. 다음으로 UI 노드를 살펴봅니다. 전투씬에는 조작 UI가 있을 것이고, 모든 UI는 캐릭터의 블러드바와 닉네임에 가려져야 하므로 배틀씬의 메인 UI를 만들 때 특별히 UIBloodRoot 노드를 만들어 모든 피를 걸어두도록 합니다. 그림과 같이 game.bar 및 별칭 개체:

마지막으로 닉네임 + 혈흔이 있는 UI 오브젝트를 만들고 캐릭터 생성 시 그림과 같이 이 오브젝트를 생성합니다.

전투 시스템에서 3D 캐릭터의 3 UI 코드 디자인

우선, 각 전투 유닛에 대해 플레이어 개체와 같은 전략을 제공하는 관리 클래스를 설계하고, 많은 게임에서 플레이어를 제어하는 ​​Player 클래스를 설계하고, Boss 몬스터는 BossEnemy 클래스를 설계하여 Boss를 제어하고, Player , Boss는 많은 전략이 필요합니다. 일부는 공유되고 건강 막대는 그 중 하나이므로 일반적으로 Player와 Boss는 전략 기본 클래스 FightCharactor에서 상속합니다. 우리는 출혈과 싸우고 소품을 먹고 혈액을 추가하는 메커니즘 전략을 설계할 수 있습니다. FightCharactor 의 UI 건강 표시줄.

class FightCharactor extends Monobehaviour {
	// 实现掉血,加血,血条的机制;
	private float hp; // 战斗单元的血量
private UICharactor uiCharactor; // 控制ui血条显示,角色昵称显示的组件实例;
// end

public void Init() {} // 
}

Class Player extends FightCharactor {
// 实现玩家特有的策略
// end
}

Class BossEnemy extends FightCharactor {
	// 实现Boss特有的策略
	// end
}

다음으로, UICharactor 컴포넌트 클래스를 디자인하고, 헬스바와 닉네임의 ui 객체에 새로운 컴포넌트 클래스의 인스턴스를 추가하여 헬스바의 진행 상황과 캐릭터 닉네임을 표시하는 기능을 제공한다.

Class UICharactor extends MonoBehaviour {
	public void SetBloodPer(float per) {…}
	public void SetUnick(string unick) {…}
}

메인 전투 UI 인터페이스의 제어 코드에서 인터페이스 UICharactor CreateUICharactor()를 제공하고 UIChractor 객체의 인스턴스를 반환합니다. 의사 코드는 다음과 같습니다.

UICharactor CreateUICharactor() {
    GameObject uiObject = GameObject. Instantiate(UI血条+昵称的预制体);
	// 将血条对象放到UIBloodRoot节点下;
uiObject.transform.SetParent(this.UIBloodRoot, false); 

UICharactor ctrl = uiObject.AddComponent<UICharactor>(); //添加组件实例到UI节点
return ctrl;

}

전투 캐릭터의 FightCharactor 클래스에 있는 초기화 메서드 Init에서 UI 제어 코드의 CreateUICharactor 인터페이스를 호출하여 UICharactor의 구성 요소 인스턴스를 가져옵니다. 그러면 UICharactor의 인터페이스를 호출하여 혈액량과 별명을 표시할 수 있습니다. 전투.

public void Init() {
	this.uiCharactor = 游戏UI界面控制对象实例. CreateUICharactor();
}

코드에서 this.uiCharactor.SetBloodPer 인터페이스는 캐릭터의 혈액량을 표시할 수 있고 this.uiCharactor.SetUnick 인터페이스는 플레이어의 닉네임 등을 표시할 수 있습니다.

마지막으로 캐릭터가 가는 곳마다 UI 체력바 닉네임 오브젝트의 위치가 업데이트 되는데 이걸 어떻게 디자인할까요? FightCharactor 클래스에 LateUpdate 메서드를 작성하여 전투 유닛에서 mountPoint 마운트 지점의 위치를 ​​얻은 다음 이 위치를 게임 카메라와 결합하여 화면 좌표로 변환한 다음 ShowAt(Vector3 screenPos) 함수를 UICharactor 코드; UGUI에서는 화면 좌표가 ui 노드의 세계 좌표로 변환되어 UI 블러드바 닉네임 노드의 위치가 mountPoint에 해당하는 화면 포인트에 놓이고 플레이어가 동기화된 것처럼 보입니다.

class FightCharactor {
	// …
	void LateUpdate() {
		Vector3 worldPos = this.mountPoint.transform.position;
		Vector3 sceenPos = this.gameCamera.WorldToSceen(worldPos);
		this.uiCharactor.ShowAt(sceenPos);
}
	// …
}

class UICharactor {
	// …
	public void ShowAt(Vector3 sceenPos) {
		Vector3 wordPos = ui模式下屏幕坐标转世界坐标;
		this.transform.position = worldPos;
}
	// …
}

이번 호에 나오는 전투 시스템의 UI 블러드바 닉네임의 구조와 디자인을 여기에서 분석해 보았는데, 지금 바로 그룹에서 받을 수 있는 구조와 디자인을 충분히 설명하고 구현한 코스웨어를 영상으로 찍어보았습니다.

추천

출처blog.csdn.net/bycw666/article/details/123572414