Unityでアイテム欄メニュー画面を作ってみたメモ⑤アイテムをインベントリから捨てる機能を作る

バーチャル3Dクリエイター神部まゆみです(*^_^*)

この記事はUnityでアイテム欄メニュー画面を作ってみた記事の続きです。

前回の記事はこちら。

やりたいこと：アイテムを捨てる機能を作る
ChatGPTパイセンに聞いてみる
実際に実装してみる
これで動いた！
1. 捨てたらフィールドに落とす方式もやりたいけどオブジェクトを用意しないと…
つづく？

やりたいこと：アイテムを捨てる機能を作る

とりあえずアイテムの詳細を表示する機能は作れたので、次は捨てる処理を作りたい。

拾う機能はオブジェクトを作ったりしないといけないため、こちらのほうが先にできるっぽいのでやってみました。

ChatGPTパイセンに聞いてみる

とりあえず彼に聞けばなんとかなるだろう…。

神部まゆみ

ここまで良い感じに実装できましたが、次は捨てるとか拾うとかですかね？
スペース的にアイテム詳細欄の近くの方が良いんでしょうか？というか項目が増えてきたのでそろそろ配置も考えないといけませんが

ChatGPT

動いたとのこと、よかったです！🎉
ここまで来るともうUI設計フェーズに入ってます。かなりゲームっぽくなってきましたね。

次に何を作るか？（おすすめ順）

今の流れだと自然なのは👇

使う／装備する
捨てる
拾う（ワールド側）

なので、
👉 「捨てる」ボタンをアイテム詳細パネルに追加
が一番分かりやすくて実装もしやすいです。

「捨てる」の配置はどこが良い？

結論

**アイテム詳細欄の近く（下 or 右）**がベストです。

理由：

「このアイテムに対する操作」だと直感的
Slot → Detail → Action の流れが自然
ボタンが増えても管理しやすい

まず「捨てる」処理全体の役割分担（超重要）

整理するとこうです👇

クラス	役割
`ItemDetailPanel`	捨てるボタンを押す
`Inventory`	アイテムを削除する
`ItemMenuController`	UIを更新する

① Inventory に「削除」処理を追加

Inventory.cs

using System.Collections.Generic;
using UnityEngine;

public class Inventory : MonoBehaviour
{
    public List<ItemData> items = new List<ItemData>();

    public void Remove(ItemData item)
    {
        if (items.Contains(item))
        {
            items.Remove(item);
            Debug.Log($"Removed item: {item.itemName}");
        }
    }
}

② ItemDetailPanel に currentItem を持たせる

ItemDetailPanel.cs

using UnityEngine;
using UnityEngine.UI;
using TMPro;

public class ItemDetailPanel : MonoBehaviour
{
    [SerializeField] private Image icon;
    [SerializeField] private TMP_Text nameText;
    [SerializeField] private TMP_Text descriptionText;

    [SerializeField] private Inventory inventory;
    [SerializeField] private ItemMenuController menuController;

    private ItemData currentItem;

    public void Show(ItemData item)
    {
        if (item == null)
        {
            gameObject.SetActive(false);
            return;
        }

        currentItem = item;

        icon.sprite = item.icon;
        nameText.text = item.itemName;
        descriptionText.text = item.description;

        gameObject.SetActive(true);
    }

    public void Hide()
    {
        currentItem = null;
        gameObject.SetActive(false);
    }

    // ★捨てるボタン用
    public void OnClickDrop()
    {
        if (currentItem == null) return;

        inventory.Remove(currentItem);
        menuController.Refresh();
        Hide();
    }
}

③ Inspector で必須設定（ここ超重要）

ItemDetailPanel を選択して👇

Inventory → プレイヤーの Inventory をドラッグ
Menu Controller → ItemMenuController をドラッグ
Icon / NameText / DescriptionText を設定

④ 捨てるボタンを作る

ヒエラルキー

ItemDetailPanel
 └─ DropButton

DropButton

Button コンポーネントを追加
OnClick() に
👉 ItemDetailPanel.OnClickDrop() を指定

⑤ ItemMenuController の Refresh()

すでにある前提ですが、念のため👇

public void Refresh()
{
    for (int i = 0; i < slots.Length; i++)
    {
        slots[i].SetItem(
            i < inventory.items.Count ? inventory.items[i] : null
        );
    }
}

⑥ 動作確認チェックリスト

✅ アイテムを選択
✅ 詳細パネルが表示
✅ 捨てるボタンを押す
✅ スロットから消える
✅ 詳細パネルが閉じる

ここまで動けば 100点 です。

そんなに難しくなさそうかなぁ。

まぁなんとかできそうな気がします。

実際に実装してみる

とりあえず闇雲に実装していきます。

Inventory.csを書き換える

プレイヤーにアタッチしているInventory.csを書き換えます。

using System.Collections.Generic;
using UnityEngine;

public class Inventory : MonoBehaviour
{
    public List<ItemData> items = new List<ItemData>();

    public void Remove(ItemData item)
    {
        if (items.Contains(item))
        {
            items.Remove(item);
            Debug.Log($"Removed item: {item.itemName}");
        }
    }
}

ItemDetailPanel.csを書き換える

アイテム説明欄のItemDetailPanel.csを書き換えます。

using UnityEngine;
using UnityEngine.UI;
using TMPro;

public class ItemDetailPanel : MonoBehaviour
{
    [SerializeField] private Image icon;
    [SerializeField] private TMP_Text nameText;
    [SerializeField] private TMP_Text descriptionText;

    [SerializeField] private Inventory inventory;
    [SerializeField] private ItemMenuController menuController;

    private ItemData currentItem;

    public void Show(ItemData item)
    {
        if (item == null)
        {
            gameObject.SetActive(false);
            return;
        }

        currentItem = item;

        icon.sprite = item.icon;
        nameText.text = item.itemName;
        descriptionText.text = item.description;

        gameObject.SetActive(true);
    }

    public void Hide()
    {
        currentItem = null;
        gameObject.SetActive(false);
    }

    // ★捨てるボタン用
    public void OnClickDrop()
    {
        if (currentItem == null) return;

        inventory.Remove(currentItem);
        menuController.Refresh();
        Hide();
    }
}

ItemMenuController.csを書き換える

GetItemのところでエラーが出ているはずなので、ここのRefreshを書き換えます。

using UnityEngine;

public class ItemMenuController : MonoBehaviour
{
    [SerializeField] private Inventory inventory;

    [SerializeField] private ItemSlot[] slots;
    private int selectedIndex = -1;

    [SerializeField] private ItemDetailPanel detailPanel;

    public void SelectSlot(int index)
    {
        if (!slots[index].HasItem()) return;

        if (selectedIndex >= 0)
            slots[selectedIndex].SetSelected(false);

        selectedIndex = index;
        slots[selectedIndex].SetSelected(true);

        var item = slots[index].GetItem();
        detailPanel.Show(item);

    }

    void OnEnable()
    {
        Refresh();
    }

    public void Refresh()
    {
        for (int i = 0; i < slots.Length; i++)
        {
            slots[i].SetItem(
                i < inventory.items.Count ? inventory.items[i] : null
            );
        }
    }
}