アイテム画像が正しく表示されません。

Slotスクリプトの image.sprite = item.sprite; が正しく動作しているか確認してください。アイテムの Sprite が null でないかもチェック。

アイテムをクリックしてもアイテムボックスに入らない。

PickupObject の OnClickObject() で ItemBox.instance.SetItem(type); を呼んでいるか確認してください。

アイテムの種類を増やしたい場合は？

Item.Type に新しいアイテムを追加し、ItemDatabaseEntity に新しいデータを登録してください。

Unity3D脱出ゲームの作り方④データベースの作成とアイテムボックスのスクリプト

1. はじめに
2. アイテム画像の準備
3. アイテムデータベースの作成
4. スロットの作成
1. ① スロットのスクリプトを作成
2. ② スロットのPrefabにスクリプトをアタッチ
5. アイテムボックスの管理
6. アイテムの取得処理
7. 動作確認
アイテム管理を簡単にするなら「Ultimate Inventory System」！
1. 「Ultimate Inventory System」を使うべき理由
2. 「Ultimate Inventory System」を導入すると…
あわせて読みたい
よくある質問（FAQ）
1. 関連記事:

1. はじめに

Unityで脱出ゲームを作るときに、プレイヤーがアイテムを取得し、後で使用できるようにする「アイテムボックス」はとても重要な仕組みです。例えば、鍵を拾ってドアを開けたり、特定のアイテムを組み合わせたりすることで、謎解きを進めることができます。

この記事では、アイテムボックスの実装方法 を詳しく解説していきます。アイテムをクリックして取得し、アイテムボックスに表示するまでの流れを、C#のスクリプトを交えて説明していくので、Unity初心者の方でも安心して進められます。

目標は、「アイテムをクリックするとアイテムボックスに追加され、画像が表示される」ようにすること！
この機能が実装できれば、アイテムの管理がスムーズになり、より本格的な脱出ゲームを作ることができるようになります。

それでは、さっそくアイテムボックスの作成に取り掛かっていきましょう！

2. アイテム画像の準備

脱出ゲームでは、プレイヤーがアイテムを取得した際に、それを視覚的に確認できるようにすることが重要です。今回は、取得したアイテムをアイテムボックスに表示するために、アイテムの画像を用意する方法を解説します。

① アイテム画像を用意する

アイテム画像は、アイテムの見た目を分かりやすくするために必要です。今回は、「鍵」 を例にして画像を作成します。

鍵のPrefabを作成
すでに作成済みの鍵オブジェクトを Prefab 化しておきましょう。まだ作っていない場合は、3D Object > Cube などを組み合わせて鍵を作成 し、Prefab にしておきます。
Prefabのスクリーンショットを撮る
Sceneビュー で鍵の Prefab を配置し、適当なアングルに調整します。その状態で スクリーンショットを撮影 し、画像編集ソフト（例：Photoshop、GIMP）で背景を削除して透過画像（PNG形式）を作成しましょう。
用意した画像を Unity にインポート 画像が完成したら、Unity の Assets フォルダに ドラッグ＆ドロップ してインポートします。

② Unity で画像を「Sprite」に変更する

Unity に画像をインポートしただけでは、UI に表示することができません。そのため、画像の Texture Type を Sprite に変更する必要があります。

画像を選択する
Project ウィンドウでインポートした画像を選択します。
Inspector の設定を変更
Inspector ウィンドウを開き、以下のように設定を変更します：
- Texture Type → Sprite (2D and UI) に変更
- Apply ボタンをクリック

③ 圧倒的な高品質！アセットを活用しよう

もし、「アイテムの画像を作るのは難しい」「時間をかけたくない」 と思っているなら、Unity Asset Storeの「3000 RPG Item Icons」 が最適です！

✅ 3000種類ものアイテムアイコンが収録！
✅ 武器・防具・ポーション・鍵など、幅広いアイテムに対応！
✅ 高解像度で、UIにすぐ使える！
✅ 透過PNGで加工も簡単！

例えば、脱出ゲームでよく使う「鍵」「ポーション」「紙切れ」などのアイコンも、このアセットにはすべて揃っています。

▶ 「3000 RPG Item Icons」の詳細を見る
👉 Unity Asset Store – 3000 RPG Item Icons

これで、アイテムの画像を UI に表示する準備ができました！
次のステップでは、アイテムの種類や画像を管理するデータベースを作成 していきます。

3. アイテムデータベースの作成

アイテムを管理するために、アイテムデータベースを作成していきます。
データベースを作ることで、アイテムの種類や画像を統一的に管理し、スクリプトから簡単にアイテム情報を取得できるようになります。

Unityの使い方⑤C#スクリプトを作成してみよう

① Item クラスの作成

まず、アイテムの情報を管理するスクリプトを作成します。

手順

Projectウィンドウで Scripts フォルダを作成（なければ新規作成）。
Scripts フォルダ内で右クリック → 「Create」→「C# Script」 を選択。
名前を Item に変更。
スクリプトを開き、以下のコードを入力。

using System;
using UnityEngine;

[Serializable] // Inspector に表示できるようにする
public class Item
{
    // アイテムの種類
    public enum Type
    {
        key,
        Cube,
        Circle,
        // アイテムを追加する場合はここに書き足す
    }

    // アイテムのタイプ
    public Type type;

    // アイテムの画像
    public Sprite sprite;

    // コンストラクタ
    public Item(Item item)
    {
        this.type = item.type;
        this.sprite = item.sprite;
    }
}

解説

Type 列挙型（enum）を使って、アイテムの種類を定義。
Sprite 型の sprite 変数で、アイテムの画像を保持。
Serializable 属性を付けることで、Inspector上で編集可能になる。
コンストラクタ (public Item(Item item)) で、アイテムの情報をコピーできるようにしている。

② ItemDatabaseEntity クラスの作成

次に、複数のアイテムを管理できるデータベースを作ります。

手順

Scripts フォルダ内で右クリック → 「Create」→「C# Script」 を選択。
名前を ItemDatabaseEntity に変更。
スクリプトを開き、以下のコードを入力。

using System.Collections.Generic;
using UnityEngine;

[CreateAssetMenu(menuName = "ItemDatabase")]
public class ItemDatabaseEntity : ScriptableObject
{
    public List<Item> items = new List<Item>();
}

解説

ScriptableObject を継承することで、Unityエディタ上でアイテムリストを管理できるようになる。
[CreateAssetMenu(menuName = "ItemDatabase")] を追加すると、UnityのProjectウィンドウで新しいアイテムデータベースを作成できる。

③ アイテムデータベースの作成

作成した ItemDatabaseEntity を使って、実際のアイテムデータベースをUnityエディタ上で作成します。

手順

Unityの Project ウィンドウで Assets フォルダを開く。
「+ ボタン」または「右クリック」 → 「Create」→「ItemDatabase」 を選択。
New ItemDatabaseEntity というファイルが作成される。
New ItemDatabaseEntity をクリックして Inspector で開く。
+ ボタン を押してアイテムを追加。
**アイテムの種類（Type）と画像（Sprite）**を設定する。

④ ItemDatabase スクリプトの作成

作成したデータベースを利用して、アイテムを取得するスクリプトを作成します。

手順

Scripts フォルダ内で右クリック → 「Create」→「C# Script」 を選択。
名前を ItemDatabase に変更。
スクリプトを開き、以下のコードを入力。

using UnityEngine;

public class ItemDatabase : MonoBehaviour
{
    // どこからでもアクセスできるようにする
    public static ItemDatabase instance;

    private void Awake()
    {
        instance = this;
    }

    [SerializeField] ItemDatabaseEntity itemDatabaseEntity = default;

    // アイテムを取得する関数
    public Item Spawn(Item.Type type)
    {
        foreach (Item itemData in itemDatabaseEntity.items)
        {
            // データベースから一致するアイテムを探す
            if (itemData.type == type)
            {
                return new Item(itemData);
            }
        }
        return null;
    }
}

解説

ItemDatabase は ItemDatabaseEntity からデータを取得するクラス。
Spawn() 関数を呼び出すことで、アイテムの Type に一致するデータを取得できる。

⑤ Unity上で ItemDatabase を設定

作成した ItemDatabase スクリプトを空のオブジェクトにアタッチし、データベースを設定します。

手順

Hierarchy ウィンドウで「空のオブジェクト」を作成（右クリック → Create Empty）。
オブジェクトの名前を ItemDatabase に変更。
ItemDatabase スクリプトをドラッグ＆ドロップしてアタッチ。
ItemDatabase の Inspector を開き、ItemDatabaseEntity の欄に先ほど作成した New ItemDatabaseEntity をドラッグ＆ドロップ。

まとめ

Item クラスを作成し、アイテムの種類と画像を管理。
ItemDatabaseEntity (ScriptableObject) を作成し、Unityエディタ上でアイテムリストを編集できるようにした。
ItemDatabase クラスを作成し、データベースからアイテムを取得する処理を実装。
Unityエディタで ItemDatabase を設定し、データを読み込めるようにした。

これで、アイテムデータを管理できるデータベースの作成が完了しました！🎉
次のステップでは、取得したアイテムをスロットに反映する処理を作っていきます。

4. スロットの作成

前回の記事で作成したスロットの Prefab を活用し、アイテム取得時にスロットの画像を変更できるようにスクリプトを作成していきます。スロットはアイテムを収納するための枠で、ここにアイテムの画像を表示させることで、プレイヤーが取得したアイテムを確認できるようになります。

① スロットのスクリプトを作成

スロットにアイテムの画像を表示するスクリプトを作成します。

プロジェクトウィンドウで右クリック
「Create」→「C# Script」を選んで、新しいスクリプトを作成し、「Slot」 と名前を付けます。
スクリプトを開いて、以下のコードを入力してください。

using UnityEngine;
using UnityEngine.UI;

public class Slot : MonoBehaviour
{
    [SerializeField] Image image = default;
    Item item = null;

    // アイテムをセットする
    public void Set(Item item) 
    {
        this.item = item;
        image.sprite = item.sprite;
    }

    // スロットが空かどうかを判定する
    public bool IsEmpty() 
    {
        return item == null;
    }
}

スクリプトの解説

Set(Item item)
- 受け取ったアイテムの画像を image.sprite に設定します。
- これにより、スロットにアイテムの画像が表示されるようになります。
IsEmpty()
- そのスロットが空いているかどうかを判定するメソッドです。
- item が null の場合は空（true）、アイテムが入っている場合は false を返します。

② スロットのPrefabにスクリプトをアタッチ

前回作成したスロットの Prefab に、上記の Slot スクリプトを適用します。

Unityの使い方⑬ プレハブ（Prefab）で効率よくオブジェクトを管理しよう

Project ウィンドウで Slot の Prefab を開く
Inspector で「Add Component」をクリックし、Slot スクリプトをアタッチ
Image を設定
- Slot スクリプトの Image 欄に、スロット内の Image コンポーネントを ドラッグ＆ドロップ で設定。

これでスロットの作成は完了です！次は アイテムボックスに取得したアイテムを追加する処理 を作っていきます。

5. アイテムボックスの管理

アイテムボックスは、取得したアイテムを管理し、スロットに表示する重要な役割を持っています。ここでは、アイテムボックスがすべてのスロットを把握し、取得したアイテムを左詰めで表示する処理を実装していきます。

① ItemBoxスクリプトの作成

まず、ItemBox という新しい C# スクリプトを作成します。

作成手順：

プロジェクトウィンドウを右クリック
「Create」→「C# Script」を選択
ItemBox という名前を付ける
スクリプトを開いて、以下のコードを入力する

using UnityEngine;

public class ItemBox : MonoBehaviour
{
    // アイテムボックスがすべてのスロットを取得
    [SerializeField] Slot[] slots = default;

    // どこからでもアクセスできるようにする
    public static ItemBox instance;

    private void Awake()
    {
        instance = this;
    }

    // アイテムを受け取る処理
    public void SetItem(Item item)
    {
        for (int i = 0; i < slots.Length; i++)
        {
            Slot slot = slots[i];
            if (slot.IsEmpty()) // 空のスロットがあるかチェック
            {
                slot.Set(item); // アイテムをスロットにセット
                break;
            }
        }
    }
}

② スクリプトの解説

slots 配列を使って、アイテムボックス内のスロットを管理。
Awake() メソッドで instance を設定し、他のスクリプトからアクセスできるようにする。
SetItem() メソッドで、アイテムを取得した際に空いているスロットにアイテムをセット。

③ スクリプトをアイテムボックスにアタッチ

次に、作成した ItemBox スクリプトを ItemBoxCanvas にアタッチします。

設定手順：

ヒエラルキーの ItemBoxCanvas を選択します。
ItemBox スクリプトをドラッグアンドドロップしてアタッチします。

これで、アイテムボックスのスクリプトが適用されました。

④ スロットの設定

ItemBox には、管理するスロットを設定する必要があります。

設定手順：

ItemBoxCanvas の ItemBox コンポーネントを見る
slots の配列フィールドが表示される
ヒエラルキーに配置しているすべての Slot を slots のリストにドラッグ＆ドロップ

これで、すべてのスロットが ItemBox に認識され、アイテムが取得された際に自動的に空のスロットへ配置されます。

まとめ

ItemBox スクリプトを作成し、スロットを管理
アイテム取得時に、空いているスロットに自動で配置
スクリプトを ItemBoxCanvas にアタッチし、スロットを設定

次のステップでは、取得したアイテムを使用する処理 を実装していきます！

6. アイテムの取得処理

さて、ここまでで アイテムのデータベース と アイテムボックスのスロット管理 の準備ができました。
次は、アイテムをクリックしたときに取得し、アイテムボックスに画像を反映させる処理 を作っていきます。

① PickupObject スクリプトの修正

アイテムをクリックしたときに ItemBox に追加するため、PickupObject スクリプトを編集していきます。

まずは PickupObject.cs を開いて、以下のコードを入力してください。

using UnityEngine;

public class PickupObject : MonoBehaviour
{
    // 取得するアイテムの種類を設定
    public Item.Type type = default;

    // アイテムをクリックしたときの処理
    public void OnClickObject()
    {
        // アイテムデータベースからアイテム情報を取得
        Item item = ItemDatabase.instance.Spawn(type);

        // アイテムボックスにアイテムを追加
        if (item != null)
        {
            ItemBox.instance.SetItem(item);
        }

        // クリックしたアイテムを非表示にする
        gameObject.SetActive(false);
    }
}

このスクリプトの役割は次の通りです。

✅ クリックされたアイテムの種類をデータベースから探す
✅ 取得したアイテムを ItemBox に追加する
✅ クリックしたオブジェクトを非表示にする

② ゲームオブジェクトにスクリプトを設定

次に、この PickupObject スクリプトを ゲーム内のアイテムにアタッチ します。

ヒエラルキー でアイテムオブジェクト（例：鍵の オブジェクト）を選択。
インスペクター で「Add Component」をクリックし、「PickupObject」を検索して追加。
PickupObject スクリプトの 「Type」 を設定。（例: key）

③ アイテムクリック時のイベントを設定

アイテムをクリックしたときに OnClickObject() が実行されるように、イベントシステムを使って設定 します。

アイテムオブジェクト を選択。
インスペクター の「Button」コンポーネント（または Event Trigger を追加）を確認。
「OnClick」イベントを追加し、PickupObject の OnClickObject() を設定。

これで、アイテムをクリックしたときに アイテムボックスに画像を反映 させる処理が完成しました！ゲームを実行して確認しましょう！

7. 動作確認

さて、これまでに作成したスクリプトや設定が正しく機能するか、テストプレイを行いましょう。

① Unityのプレイモードを開始

まずは Unityエディターの再生ボタン（▶）をクリック して、ゲームを開始します。

② アイテムをクリックして取得

ゲーム画面で、用意した アイテムをクリック してみましょう。
クリックすると、以下の処理が実行されるはずです。

PickupObjectスクリプトの OnClickObject() が動作し、
ItemBox.instance.SetItem(type); が呼び出される。
ItemDatabase から、クリックしたアイテムのデータを取得。
ItemBox が空いているスロットを見つけ、アイテム画像をセット。
アイテムのオブジェクトが gameObject.SetActive(false); で非表示になる。

③ アイテムボックスに画像が表示されているか確認

アイテムをクリックしたら、アイテムボックス内のスロットに画像が表示されているか を確認します。

画像が正しくスロットに表示されていれば、問題なく動作しています！
もし表示されない場合は、以下のチェックポイントを確認しましょう。

④ トラブルシューティング（動作しない場合の対処法）

アイテム画像が表示されない

☑ Slotスクリプトで image.sprite = item.sprite; が正しく設定されているか？
☑ ItemDatabaseEntity にアイテムの Sprite が正しく登録されているか？
☑ ItemBox の slots 配列にすべてのスロットが正しく登録されているか？

アイテムをクリックしてもボックスに入らない

☑ PickupObject の OnClickObject() メソッドが実行されているか？
☑ ItemBox.instance.SetItem(type); の type が適切に設定されているか？
☑ ItemDatabase に Spawn() メソッドでアイテムを取得できているか？