【unity】敵に画像を表示する方法(UI Image)【画像切り替え、画像をセット】


敵に画像を表示する方法(UI Image)
完成イメージ
[Player HP] [Enemy HP]

スライム画像

apple の意味は?

[入力欄]
[OK]

① 敵の画像を用意

まず画像が必要

おすすめ:

スライム
ゴブリン
ドラゴン
魔王

画像形式:

PNG

② Unityに画像を入れる

Project ウィンドウ
→ Assets フォルダ
→ Images フォルダ作成
→ 画像をドラッグ

③ Sprite に変更(重要)

画像をクリック → Inspector

Texture Type
→ Sprite (2D and UI)
→ Apply

これしないとUIに表示できない。

④ Image を作る

Hierarchy
→ Canvas 右クリック
→ UI
→ Image

名前変更:

EnemyImage

⑤ 画像をセット

EnemyImage を選択 → Inspector

Image
→ Source Image
→ さっき入れた画像をドラッグ

すると表示されます。

⑥ 位置とサイズ

RectTransform

Pos X = 0
Pos Y = 80
Width = 200
Height = 200

中央に敵が表示される。

⑦ Enemy.cs に画像切り替え機能を追加

敵を倒したら次の敵に変えたりできます。

using UnityEngine;
using UnityEngine.UI;

public class Enemy : MonoBehaviour
{
public int maxHP = 50;
public int currentHP;
public Slider hpBar;

public Image enemyImage;
public Sprite[] enemySprites;
private int enemyIndex = 0;

void Start()
{
LoadEnemy(enemyIndex);
}

public void LoadEnemy(int index)
{
enemyIndex = index;
enemyImage.sprite = enemySprites[index];
currentHP = maxHP;
hpBar.value = currentHP;
}

public void TakeDamage(int damage)
{
currentHP -= damage;
hpBar.value = currentHP;

if (currentHP <= 0)
{
Debug.Log("Enemy Defeated!");
enemyIndex++;

if (enemyIndex < enemySprites.Length)
{
LoadEnemy(enemyIndex);
}
else
{
Debug.Log("All Enemies Defeated!");
}
}
}
}

⑧ Inspectorで設定(重要)

Enemy オブジェクトを選択

Enemy (Script)

Hp Bar → EnemyHPBar をドラッグ
Enemy Image → EnemyImage をドラッグ
Enemy Sprites → + を押す
画像を入れる

例:

Element 0 → スライム
Element 1 → ゴブリン
Element 2 → ドラゴン

⑨ これでゲームはこうなる

スライム出現

英単語問題

倒す

ゴブリン出現

倒す

ドラゴン出現

倒す

クリア