인벤토리 만들기

 

인벤토리 만들기

---

1. 인벤토리 스크롤 만들기

---

https://kkln2486.tistory.com/180

인벤토리 스크롤 설정 (Scroll View, Grid Layout Group)

 

 

2. 스크립트 작성

---

SkillInventory

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

public class SkillInventory : MonoBehaviour
{
    private PlayerSO _playerSO;

    [Header("Melee Skill")]
    [SerializeField] private GameObject _meleeSkillScroll;
    [SerializeField] private GameObject _meleeSlotContent;
    
    // Info 창을 끄기 위해
    [Header("Skill Info")]
    [SerializeField] private GameObject _skillInfo;

	// 인벤토리에서 특정 종류의 스킬들만 List에 넣어줌
    private List<SkillSO> _skills;
    
	// 인벤토리의 각각 Slot마다 가지고 있는 스크립트
    private SkillInventorySlot _skillInventorySlot;
    
    // 클릭한 SkillSO를 받아옴
    [HideInInspector] public SkillSO InfoSkillSO;

    private void Awake()
    {
        _skills = new List<SkillSO>();
    }

    void Start()
    {
    	_playerSO = GameManager.I.PlayerManager.PlayerPrefab.GetComponent<PlayerController>().PlayerSO;
        UpdateMeleeSKillInventory();
    }
    
    // 활성화 될 때마다, 업데이트 해줌
     private void OnEnable()
    {
        if(_playerSO != null)
        {
            UpdateMeleeSKillInventory();
        }
    }

    private void UpdateMeleeSKillInventory()
    {
        for (int i = 0; i < _meleeSlotContent.transform.childCount; i++)
        {
            _skillInventorySlot = _meleeSlotContent.transform.GetChild(i).GetComponent<SkillInventorySlot>();
            _skillInventorySlot.SkillEmpty();
        }

        for (int i = 0; i < _playerSO.SkillInventroy.Count; i++)
        {
            if(_playerSO.SkillInventroy[i].Type == SkillSO.SkillType.Melee)
            {
                _skills.Add(_playerSO.SkillInventroy[i]);
            }
        }

        for (int i = 0; i < _skills.Count; i++)
        {
            _meleeSlotContent.transform.GetChild(i).transform.GetChild(0).GetComponent<Image>().sprite = _skills[i].Icon;
            _skillInventorySlot = _meleeSlotContent.transform.GetChild(i).GetComponent<SkillInventorySlot>();
            _skillInventorySlot.SkillText(_skills[i]);
        }

        _skills.Clear();
    }
    
    public void EquipButton()
    {
        _playerSO.EquipMeleeSkill.IsEquip = false;
        _playerSO.EquipMeleeSkill = InfoSkillSO;
        InfoSkillSO.IsEquip = true;
        UpdateMeleeSKillInventory();
        ExitSkillInfo(); 
    }

    private void ExitSkillInfo()
    {
        _skillInfo.SetActive(false);
    }
}

 

 

SkillInventorySlot

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using TMPro;

public class SkillInventorySlot : MonoBehaviour
{
	// Slot의 SkillSO를 받아옴
    private SkillSO _skillSO;
    
    private PlayerSO _playerSO;
    public bool _isSkill;

    [Header("Inventory")]
    [SerializeField] private SkillInventory _skillInventory;

    [Header("Slot")]
    [SerializeField] private TMP_Text _skillLevelText;
    [SerializeField] private TMP_Text _skillRankText;
    [SerializeField] private GameObject _skillLevel;
    [SerializeField] private GameObject _skillRank;
    [SerializeField] private GameObject _equip;
    [SerializeField] private Image _emptyImage;

    [Header("MeleeSkillInfo")]
    [SerializeField] private GameObject _meleeSkillInfo;
    [SerializeField] private TMP_Text _meleeSkillTag;
    [SerializeField] private Image _equipMeleeSkillImage;
    [SerializeField] private TMP_Text _meleeSkillDescriptionText;
    [SerializeField] private TMP_Text _meleeSkillLevelText;
    [SerializeField] private TMP_Text _meleeSkillRankText;
    [SerializeField] private TMP_Text _meleeSkillAtkText;
    [SerializeField] private TMP_Text _meleeSkillUpgradeText;

    private void Start()
    {
        _playerSO = GameManager.I.PlayerManager.PlayerPrefab.GetComponent<PlayerController>().PlayerSO;
    }
	
    // Slot의 스킬 정보를 불러옴
    public void SkillText(SkillSO skillSO)
    {
        _isSkill = true;
        
        // Slot의 SkillSO 받아옴
        _skillSO = skillSO;

		// Slot의 이미지가 보이도록 Color.a값 수정
        _emptyImage.color = new Color(255 / 255f, 255 / 255f, 255 / 255f, 255 / 255f);
        
        _skillLevelText.text = skillSO.Level.ToString();
        _skillLevel.SetActive(true);

		// Rank에 맞게 설정
        string rank;
        if (skillSO.Rank == SkillSO.SkillRank.B) rank = "B";
        else if (skillSO.Rank == SkillSO.SkillRank.A) rank = "A";
        else rank = "S";

        if (rank == "B")
        {
            _skillRankText.color = new Color(25 / 255f, 144 / 255f, 0 / 255f, 255 / 255f);
        }
        else if(rank == "A")
        {
            _skillRankText.color = new Color(255 / 255f, 16 / 255f, 0 / 255f, 255 / 255f);
        }
        else
        {
            _skillRankText.color = new Color(244 / 255f, 255 / 255f, 40 / 255f, 255 / 255f);
        }
        _skillRankText.text = rank;
        _skillRank.SetActive(true);

        if (skillSO.IsEquip) _equip.SetActive(true);
        else _equip.SetActive(false);
    }

	// Slot 초기화
    public void SkillEmpty()
    {
        _isSkill = false;

		// Slot의 빈 이미지가 보이지 않도록 Color.a값 수정
        _emptyImage.color = new Color(255 / 255f, 255 / 255f, 255 / 255f, 0 / 255f);
        
        _skillLevel.SetActive(false);
        _skillRank.SetActive(false);
        _equip.SetActive(false);
    }

	// SkillInfo 띄움
    public void SkillInfoButton()
    {
        if (!_isSkill)
        {
            GameManager.I.SoundManager.StartSFX("ButtonClickMiss");
            return;
        }

        GameManager.I.SoundManager.StartSFX("ButtonClick");
        _skillInventory.InfoSkillSO = _skillSO;

        string rank;
        if (_skillSO.Rank == SkillSO.SkillRank.B) rank = "B";
        else if (_skillSO.Rank == SkillSO.SkillRank.A) rank = "A";
        else rank = "S";

        if (_skillSO.Type == SkillSO.SkillType.Melee)
        {
            _meleeSkillTag.text = _skillSO.Tag;
            _equipMeleeSkillImage.sprite = _skillSO.Icon;
            _meleeSkillDescriptionText.text = _skillSO.Description;
            _meleeSkillLevelText.text = _skillSO.Level.ToString();
            _meleeSkillRankText.text = rank;
            _meleeSkillAtkText.text = ((int)(_playerSO.Atk * _skillSO.AtkRatio)).ToString();
            _meleeSkillUpgradeText.text = _skillSO.CurrentUpgradeCount.ToString() + " / " + _skillSO.MaxUpgradeCount.ToString();

            _meleeSkillInfo.SetActive(true);
        }
        else if(_skillSO.Type == SkillSO.SkillType.Ranged)
        {
            _rangedSkillTag.text = _skillSO.Tag;
            _equipRangedSkillImage.sprite = _skillSO.Icon;
            _rangedSkillDescriptionText.text = _skillSO.Description;
            _rangedSkillLevelText.text = _skillSO.Level.ToString();
            _rangedSkillRankText.text = rank;
            _rangedSkillAtkText.text = ((int)(_playerSO.Atk * _skillSO.AtkRatio)).ToString();
            _rangedSkillUpgradeText.text = _skillSO.CurrentUpgradeCount.ToString() + " / " + _skillSO.MaxUpgradeCount.ToString();

            _rangedSkillInfo.SetActive(true);
        }
        else
        {
            _areaSkillTag.text = _skillSO.Tag;
            _equipAreadSkillImage.sprite = _skillSO.Icon;
            _areaSkillDescriptionText.text = _skillSO.Description;
            _areaSkillLevelText.text = _skillSO.Level.ToString();
            _areaSkillRankText.text = rank;
            _areaSkillAtkText.text = ((int)(_playerSO.Atk * _skillSO.AtkRatio)).ToString();
            _areaSkillUpgradeText.text = _skillSO.CurrentUpgradeCount.ToString() + " / " + _skillSO.MaxUpgradeCount.ToString();
            _areaSkillCountText.text = _skillSO.Count.ToString();
            _areaSkillIntervalText.text = _skillSO.Interval.ToString();

            _areaSkillInfo.SetActive(true);
        }
    }

    public void SkillInfoExitButton()
    {
        _meleeSkillInfo.SetActive(false);
        _rangedSkillInfo.SetActive(false);
        _areaSkillInfo.SetActive(false);
    }
}

 

 

3. ItemSlot, SkillInfo 만들기

---

 

Scroll 이름을 변경하고 Content에 이미지 추가

 

 

 

1. Image에 Image 추가
2. EquipText Image 추가 / 자식으로 Text 추가해서 E 입력
3. RankText 추가 / B 입력, 원하는 칼라 설정
4. LevelText Image 추가 / 자식으로 Text 추가해서 1 입력
5. 자식 Image의 Color.a값을 0으로 해서 투명하게 해줌

 

 

 

Image에 Button을 추가하고 On Click 추가

 

 

 

Button 클릭 시, 활성화 되는 UI를 제작

 

 

 

MeleeSkill Slot에 SkillInventorySlot 스크립트를 추가하고 필요한 정보만 연결

 

 

 

각각 Button을 연결

 

 

4. 연결

---

 

인벤토리 스크립트를 인벤토리에 추가, 각각 오브젝트 연결

 

 

 

가장 상위 Image에 Slot 스크립트를 연결, 위와 같이 오브젝트를 연결해 줌

 

 

 

원하는 Slot의 수만큼 복사