팀프 21.07.29. Unity UGUI - 클래스 선택

위 사진과 같이 선택한 클래스에만 체크표시가 뜨게하려 했다.

거기에 더해 자동화를 구현하여 후에 캐릭터볼륨이 줄거나 늘더라도 인스펙터창에서 수정할 수 있도록 구현했다.

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

public class UIClassItem : MonoBehaviour
{
    public Transform parent;
    public Button btnSelect;
    public Image imgSelect;
  
    public void Init(GameObject model)
    {
        GameObject go = Instantiate(model, this.parent);          
    }

    public void Deselect()
    {
        this.imgSelect.gameObject.SetActive(false);
    }

    public void Select()
    {
        this.imgSelect.gameObject.SetActive(true);
    }
}

• 우선 UIClassItem이다. 
• 클래스 한 칸 단위를 뜻하는데, 해당 오브젝트는 Init을 할 때 전달받은 게임오브젝트를 생성시키며 

• 이런 모습을 만들어 진다.
• 그리고 체크표시가 활성화되고 체크표시를 비활성시키는 기능이 담겼다.

 

 

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

public class UIClass : MonoBehaviour
{
    public Button btnClose;
    public List<GameObject> prefabUIHunterList;
    public List<GameObject> prefabUIGuardianList;
    public GameObject prefabUIClassItem;

    public Transform parentHunter;
    public Transform parentGuardian;
    List<UIClassItem> uiHunterItemList;
    List<UIClassItem> uiGuardianItemList;
    
    public void Init() 
    {
        uiHunterItemList = new List<UIClassItem>();
        uiGuardianItemList = new List<UIClassItem>();
        for(int i = 0; i < prefabUIHunterList.Count; i++)
        {
            GameObject modelHunter = this.prefabUIHunterList[i];            
            GameObject go = Instantiate(this.prefabUIClassItem, parentHunter);
            UIClassItem uiClassHunterItem = go.GetComponent<UIClassItem>();
            uiHunterItemList.Add(uiClassHunterItem);
            uiClassHunterItem.Init(modelHunter);
            uiClassHunterItem.btnSelect.onClick.AddListener(() =>
            {
                Debug.Log(modelHunter.name);
                DeselectAllHunters();
                uiClassHunterItem.Select();
            });
        }        
        
        for(int i = 0; i < prefabUIGuardianList.Count; i++)
        {
            GameObject modelGuardian = this.prefabUIGuardianList[i];
            GameObject go = Instantiate(this.prefabUIClassItem, parentGuardian);
            UIClassItem uiClassGuardianItem = go.GetComponent<UIClassItem>();
            uiGuardianItemList.Add(uiClassGuardianItem);
            uiClassGuardianItem.Init(modelGuardian);
            uiClassGuardianItem.btnSelect.onClick.AddListener(() =>
            {
                Debug.Log(modelGuardian.name);
                DeselectAllGuardians();
                uiClassGuardianItem.Select();
            });
        }
    }

    void DeselectAllHunters()
    {
        foreach(UIClassItem uiClassItem in uiHunterItemList)
        {
            uiClassItem.Deselect();
        }
    }

    void DeselectAllGuardians()
    {
        foreach(UIClassItem uiClassItem in uiGuardianItemList)
        {
            uiClassItem.Deselect();
        }
    }    
}

• 해당 UIClassItem들을 총괄적으로 관리하는 UIClass스크립트에서는 TreasureHunter와 Guardian라는 두 가지 진영의 캐릭터들을 각기 다른 줄에서 스크롤 시키기 위해서 생성되는 위치와 프리팹 등을 모두 각각 사용하였다.
• prefabUIHunterList와 prefabUIGuardianList를 통해 생성하고 싶은 캐릭터들을 인스펙터로 할당받을 수 있으며
• List의 Count만큼 반복문을 실행하며 UIClassItem을 생성한다.
• 생성된 UIClassItem은 List의 인덱스를 따라 차례대로 캐릭터UI를 할당받으며
• 생성된 UI들을 List에 저장해둔다.
• 그리고 선택을 하게되면 리스트에 존재하는 모든 UI들의 체크를 해제하고 자신의 체크를 활성화시킨다.