FarmRPG　Unity Inventory&Item Part10 InvenotrySlotにカーソルを合わせると説明欄を表示する

# 概要
今回はInvenotrySlotにカーソルを合わせると説明欄を表示するようにします。

![0605.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/17ce5ade-7801-3275-01eb-0d2b1c6e0387.gif)


# 開発環境

IDE:Rider
Unity:2020.3.42(LTS)
OS:Windows10

# UnityEditor上の設定


## inventoryTextBoxプレハブの作成


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/e87759b8-a6ae-c15a-63d0-b8ce48b97e17.png)



### InventoryTextBox

TextBoxImage(1)とTextBoxImage(2)を整列して並べるため、ContentSizeFitter Vertical LayoutGroupコンポーネントをアタッチします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/ac98bf79-3317-107e-00d3-2b47dc80fc84.png)


### TextBoxImageBox(1) ‥(2)も同様の設定
Imageコンポーネントで背景の画像を追加
Text類を垂直方向に並べるためVerticalLayoutGroupコンポーネントを追加

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/0bd285ef-a4c1-7eb4-ae80-b18b7956e19c.png)



## UIInventorySlotのインスペクターの設定を行う。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/52ca32b8-735e-af72-c833-9d73eabab705.png)


# 実装のポイント

## InventorySlotにカーソルを合わせて説明欄を表示させる
UIInventorySlotクラスにOnPointerEnterメソッドを加えます。
OnPointerEnterはオブジェクトがマウスーバーされた時に実行されるメソッドです。

UIInventoryTextBoxクラスを新規作成します。InventoryTextBoxのTextオブジェクトを更新するメソッドSetTextboxTextを加えます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/861b7c15-0b6a-f5b0-535a-4169cd8cf790.png)


## InventorySlotからカーソルを外して説明欄を消去する
UIInventorySlotクラスにOnPointerExitメソッドを加えます。
OnPointerExitはマウスオーバーされる時に実行されます。
処理内容としてはOnPointerEnterで生成したinventoryTextBoxを削除します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/3bb3092d-5d99-2a61-ada6-d73eb1e460e0.png)


# コード部分

## UIInventorySlot

```diff_c_sharp:UIInventorySlot.cs
using TMPro;
using Unity.VisualScripting;
using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.UI;

public class UIInventorySlot : MonoBehaviour,IBeginDragHandler,IDragHandler,IEndDragHandler,IPointerEnterHandler,IPointerExitHandler
{
    private Camera mainCamera;
    private Canvas parentCanvas;
    private GameObject draggedItem;
    private Transform parentItem;
    
    public Image inventorySlotHighlight;
    public Image inventorySlotImage;
    public TextMeshProUGUI textMeshProUGUI;
    [SerializeField] private UIInventoryBar inventoryBar = null;
    [SerializeField] private GameObject inventoryTextBoxPrefab = null;
    public ItemDetails itemDetails;
    [SerializeField] private GameObject itemPrefab;
    public int itemQuantity;
    [SerializeField] private int slotNumber = 0;

    private void Awake()
    {
        parentCanvas = GetComponentInParent<Canvas>();
    }
    public void OnPointerEnter(PointerEventData eventData)
    {
        if (itemQuantity != 0)
        {
            inventoryBar.inventoryTextBoxGameObject = Instantiate(inventoryTextBoxPrefab, transform.position, Quaternion.identity);
            inventoryBar.inventoryTextBoxGameObject.transform.SetParent(parentCanvas.transform,false);

            UIInventoryTextBox inventoryTextBox = inventoryBar.inventoryTextBoxGameObject.GetComponent<UIInventoryTextBox>();
            
            string itemTypeDescription = InventoryManager.Instance.GetItemTypeDescription(itemDetails.itemType);
            
            inventoryTextBox.SetTextboxText(itemDetails.itemDescription, itemTypeDescription, "", itemDetails.itemLongDescription,"","");
            
            inventoryBar.inventoryTextBoxGameObject.GetComponent<RectTransform>().pivot = new Vector2(0.5f, 0f);
            inventoryBar.inventoryTextBoxGameObject.transform.position = new Vector3(transform.position.x, transform.position.y + 50f, transform.position.z);
        }
    }

    public void OnPointerExit(PointerEventData eventData)
    {
        DestroyInventoryTextBox();
    }

    public void DestroyInventoryTextBox()
    {
        if (inventoryBar.inventoryTextBoxGameObject != null)
        {
            Destroy(inventoryBar.inventoryTextBoxGameObject);
        }
    }
    
    }


```


## InventoryManager

```diff_c_sharp:InventoryManager.cs
using System.Collections.Generic;
using UnityEngine;


public class InventoryManager : SingletonMonobehaviour<InventoryManager>
{
    private Dictionary<int, ItemDetails> itemDetailDictionary;
    [SerializeField] private SO_ItemList itemList = null;
    public int[] inventoryListCapacityIntArray;
    public List<InventoryItem>[] inventoryLists;


    public string GetItemTypeDescription(ItemType itemType)
    {
        string itemTypeDescription;
        switch (itemType)
        {
            case ItemType.Breaking_tool:
                itemTypeDescription = Settings.BreakingTool;
                break;
            
            case ItemType.Chopping_tool:
                itemTypeDescription = Settings.ChoppingTool;
                break;
            
            case ItemType.Hoeing_tool:
                itemTypeDescription = Settings.HoeingTool;
                break;
            
            case ItemType.Reaping_tool:
                itemTypeDescription = Settings.ReapingTool;
                break;
            
            case ItemType.Watering_tool:
                itemTypeDescription = Settings.WateringTool;
                break;

            case ItemType.Collecting_tool:
                itemTypeDescription = Settings.CollectingTool;
                break;
            
            default:
                itemTypeDescription = itemType.ToString();
                break;
        }

        return itemTypeDescription;
    }   
}

```

## UIInventoryTextBox

```diff_c_sharp:UIInventoryTextBox.cs
using TMPro;
using UnityEngine;
using UnityEngine.UI;


public class UIInventoryTextBox : MonoBehaviour
{
    [SerializeField] private TextMeshProUGUI textMeshTop1 = null;
    [SerializeField] private TextMeshProUGUI textMeshTop2 = null;
    [SerializeField] private TextMeshProUGUI textMeshTop3 = null;
    
    [SerializeField] private TextMeshProUGUI textMeshBottom1 = null;
    [SerializeField] private TextMeshProUGUI textMeshBottom2 = null;
    [SerializeField] private TextMeshProUGUI textMeshBottom3 = null;


    public void SetTextboxText(string textTop1, string textTop2, string textTop3, string textBottom1,
        string textBottom2, string textBottom3)
    {
        textMeshTop1.text = textTop1;
        textMeshTop2.text = textTop2;
        textMeshTop3.text = textTop3;
        textMeshBottom1.text = textBottom1;
        textMeshBottom2.text = textBottom2;
        textMeshBottom3.text = textBottom3;


    }
}


```


## Enum

```diff_c_sharp:Enum.cs
public enum ItemType
{
    Seed,
    Commodity,
    Watering_tool,
    Hoeing_tool,
    Chopping_tool,
    Breaking_tool,
    Reaping_tool,
    Collecting_tool,
    Reapable_scenary,
    none,
    count,
    Furniture,
}

```


## Settings

```diff_c_sharp:Settings.cs

using UnityEngine;

public static class Settings 
{
    public const string HoeingTool = "Hoe";
    public const string ChoppingTool = "Axe";
    public const string BreakingTool = "Pickaxe";
    public const string ReapingTool = "Scythe";
    public const string WateringTool = "Watering Can";
    public const string CollectingTool = "Basket";
}


```


# 参考

## C#

## Unity Editor コンポーネント

### Content Size Fitter
https://docs.unity3d.com/ja/2019.4/Manual/script-ContentSizeFitter.html

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/ce603ce4-16e5-120b-614b-8fb8e0d55f85.png)


### Vetrical Layout Group

https://docs.unity3d.com/ja/2019.4/Manual/script-VerticalLayoutGroup.html

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/91166d86-1f89-b6d2-1b59-60640f7c9876.png)


### 

## Unity スクリプト

### OnPointerEnter

https://docs.unity3d.com/ja/2018.4/ScriptReference/UI.Selectable.OnPointerEnter.html

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/ca2b1822-0ac6-92ee-9dd9-d1d5f0c39763.png)


### OnPointerExit

https://docs.unity3d.com/ja/2018.4/ScriptReference/UI.Selectable.OnPointerExit.html

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/32ef5161-519f-2126-4f45-573b60bfb3f6.png)


### Transform.SetParent

https://docs.unity3d.com/ja/2020.3/ScriptReference/Transform.SetParent.html

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/d1ccf6c6-b7dc-ec20-e2e3-2d6938ea30e1.png)


### RectTransform.pivot

https://docs.unity3d.com/ja/2019.4/ScriptReference/RectTransform-pivot.html

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2710623/4ffd4233-bdcc-1f23-2b96-8b16d105343e.png)



## その他

Section7 30 Item Description Pop Ups

https://www.udemy.com/course/unity-2d-game-developer-course-farming-rpg/learn/lecture/19849066#content


github コミット分（個人確認用　privateなので見れません）

https://github.com/RYA234/LearnFarmRPG/commit/d0a005165994e849bd768b7ee8293da3fac596d5


https://github.com/RYA234/LearnFarmRPG/commit/1bf928b590d05336dca0a6ac773700d238f3ebf6