[NProject] 마음대로 만드는 게임 - 13. 슬롯 수정2

이전에 슬롯을 수정해 이제 아이템을 먹으면 아이템이 인벤토리에 추가되는것까지 완료했다.

아이템의 수량과, 아이템의 설명이 정확히 나타났으면 좋겠는데 일단 내가 구현하고싶은건 다음과 같다.

아이템에 마우스를 올리면 툴팁이 뜨는건 어떤가?

 

이 기능은 유니티에서 제공하는 마우스에 관련된 함수를 사용하면 구현 할 수 있을것 같다.

 

일단 구현하기에 앞서 SlotManager이라는 스크립트를 하나 생성해주자.

스크립트를 생성해주고, slot프리팹을 클릭해 프리팹 편집화면으로 넘어가, 슬롯에 SlotManager를 붙여주자.

이런식으로 간단하게 붙여주면 된다. 주의할점은 최 상단의 Slot 객체에 붙여야한다는점이다. (하위 오브젝트에 붙이지 말자...)

그리고 Box Collider 2D도 함께 붙여주자. 사이즈는 가로 세로 200으로 맞춰주면 된다. (마우스 함수들은 모두 마우스에서 Ray를 쏜다. 유니티의 Ray는 감지하기위해서 충돌체가 꼭 필요하다.)

 

편집 화면을 빠져나와서, 스크립트를 다음과 같이 작성하자.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class SlotManager : MonoBehaviour
{
    private void OnMouseOver() {
        print("슬롯에 마우스가 올려짐.");
    }
}

간단하게 일단 마우스가 올려지는걸 체크할 수 있도록만 작성하였다.

테스트 해보고, 로그가 정상적으로 잘 작동하면, 로그를 찍었던 위치에 코딩을 해줄것이다.

아주 잘 작동한다!

이제 슬롯에 대한 코딩을 마저 하기전에, 툴팁을 띄울 메세지창도 하나 만들어보자.

프리펩 편집 화면으로 들어가, 툴팁을 표시해줄 박스를 만들어줬다.

이 안에는 위와 같은 정보가 들어갈것이다.

그런데 입력된 글자의 크기만큼 툴팁이 커져야하니까 오브젝트를 이렇게 구성해주어야한다.

툴팁을 만들어주고, 툴팁 하위에 텍스트박스를 넣어준다. 이후 만들어둔 툴팁에는 Vertical Layout Group컴포넌트와, Content Size Fitter 컴포넌트를 추가해준다.

Vertical Layout Group는 하위 레이아웃들이 세로로 정렬되는 기능을 제공하는 컴포넌트인데, 여기서 우리는 빨간 네모박스가 쳐진 Control Child Size를 체크해줘서 하위의 크기에 맞춰 상위의 크기가 바뀌도록 설정해줄것이다.

그리고, Content Size Fitter 컴포넌트는 하위의 크기에 맞춰 상위의 크기가 알맞게 변경되게 하는 컴포넌트이다.

가로, 세로 옵션 모두 Preferred Size로 변경해주자.

이후, ToolTip의 하위 Text에 아무값이나 입력해보면, 사이즈가 계속 알맞게바뀌는것을 알 수 있다.

텍스트 사이즈는 일단 60으로 고정시켜주자.

 

작업을 마쳤으면 ToolTip을 비활성화 시켜주고 코딩을 해보자.

public class SlotManager : MonoBehaviour
{
    #region Instance
    private static SlotManager _instance;
    public static SlotManager Instance{
        get{
            if(_instance == null) _instance = FindObjectOfType(typeof(SlotManager)) as SlotManager;
            return _instance;
        }
    }
    #endregion

    [SerializeField] Item item;
    [SerializeField] GameObject tooltip;
    [SerializeField] Text tooltipText;

    private void OnMouseOver() { //마우스가 올려졌을 때.
        string str = "";
        str += item.GetItemName() + "\n";
        str += "갯수 : 1개" + "\n";
        str += "가격 : " + item.GetItemPrice().ToString() + "\n";
        str += item.GetItemInfo();
        tooltipText.text = str;
        tooltip.SetActive(true);
    }

    private void OnMouseExit() { //마우스가 오브젝트에서 벗어났을 때.
        tooltip.SetActive(false);
        tooltipText.text = "";
    }

    public void SetItem(Item _item){ //아이템 가져오기 함수
        item = _item;
    }

    public void SetNullItem(){ //아이템 비우기 함수(인벤에서 아이템 삭제될 시 사용)
        item = null;
    }
}

 

추가로, 우리가 OnMouseOver에서 아이템에 대한 정보를 가져와야 하기 때문에, 아이템을 습득 했을 때, 아이템 정보를 슬롯에도 넣어줘야한다.

따라서 PlayerManager도 다음과 같이 약간만 수정해주자.

//아이템 습득
    private void OnTriggerStay2D(Collider2D other) {
        if(other.tag == "Item"){ //태그 확인
            if(Input.GetKey(KeyCode.Space)){ //아이템 습득 키 확인
                GameManager.Instance.AddInventoryItem(other.GetComponent<ItemManager>().ReturnItem()); //인벤토리에 아이템 추가

                GameObject go = ObjectPoolingManager.Instance.GetQueue(ObjectPoolingManager.Instance.slotQueue); //미리 만들어둔 오브젝트를 가져옴
                
                //이 코드만 추가되었다!
                go.GetComponent<SlotManager>().SetItem(other.GetComponent<ItemManager>().ReturnItem()); //슬롯에 추가할 아이템 정보 받아오기.
                
                go.transform.GetChild(0).GetComponent<Image>().sprite = other.GetComponent<SpriteRenderer>().sprite; //이미지 변경
                go.transform.SetParent(GameManager.Instance.cropsParent); //부모 변경

                Destroy(other.gameObject); //인벤토리에 추가해줬으니, 오브젝트를 삭제
            }
        }
    }

 

이렇게 코딩이 완료되었으면, 유니티로 돌아가 확인해보자.

우리가 슬롯매니저를 코딩해주었으니, 필요한 오브젝트를 알맞은 위치에 넣어주자.

이후 게임을 실행해보면,

마우스를 올렸을 때, 툴팁이 잘 표시되는것을 확인 할 수 있다.

 

다음은 툴팁의 위치를 수정해보자.