[Unity]TIL (34) | 2023.09.08 | 유니티 상점 만들어보기

kjg5370·2023년 9월 8일

TIL Unity 내일배움캠프 스파르타내일배움캠프 스파르타내일배움캠프TIL

TIL

목록 보기

34/91

들어가기 앞서

팀 프로젝트가 시작되었습니다. 유니티에서는 처음으로 팀으로 협업을 해보는데요.
아침부터 기획을 해보고 팀명을 짜고 팀원들과 각자 파트를 나눠서 작업해보았습니다.
제가 맡은 부분은 상점, 아이템과 관련된 부분인데요.
어떤식으로 만들어볼까 고민을 많이 했던 것 같습니다.

오늘 배운 것

상점 씬
일단 제가 맡은 부분인 상점을 다른 사람들과 만드는 부분이 겹치지 않게 상점 씬을 따로 만들었습니다.

오늘 팀원들과 계획을 세우고 역할 분담을 하기까지 반나절이 지났기 때문에 최우선 과제는 보이는 부분을 먼저 만들어보자
라고 생각해서 일단 AssetStore에서 제공하는 무료 에셋을 이용해 씬을 꾸며보았습니다.

아이템
AssetStore에는 무료로 풀어준 리소스들이 많이 있었는데 그중에는 아이템들에 관란 리소스들도 많이 있었습니다.
그래서 일단 아이템들을 관리하기 위해서 스크립터블오브젝트를 만들었습니다.

public enum ItemType
{
    Buff, // 아이템 종류: 버프
    Skin, // 아이템 종류: 스킨
}
[CreateAssetMenu(fileName = "ItemData", menuName = "ScriptableObjects/ItemData")]
public class ShopUIData : ScriptableObject
{
    // 아이템 데이터 필드
    public ItemType itemType; // 아이템의 타입 (버프, 스킨 등)
    public Sprite itemImage; // 아이템의 이미지
    public string itemName; // 아이템의 이름
}

그리고 data 폴더를 만들어서 테스트 아이템들을 만들어 보았습니다.

일단 아이템의 틀이 될 프리팹을 만들어서 프리팹을 생성할 때 이미지를 바꿔주면 되겠다고 생각하여
UIManager를 만들어서 아이템들을 생성해보았습니다.

public class ShopUIManager : MonoBehaviour
{
    public ShopUIData[] ItemList;
    public Image imagePrefab;
    public GameObject[] parentTransform;

    int index =0;
    private void Start()
    {
        int buffIndex = 0;
        int skinIndex = 0;

        foreach (var item in ItemList)
        {
            if (item.itemType == ItemType.Buff)
            {
                createItem(item, buffIndex, parentTransform[0].transform);
                buffIndex++;
            }
            else if (item.itemType == ItemType.Skin)
            {
                createItem(item, skinIndex, parentTransform[1].transform);
                skinIndex++;
            }
        }
    }

    private void createItem(ShopUIData ItemData, int i,Transform pos)
    {
                float posY = +750 - ((i / 3) * 500);
                float posX = ((i % 3) * 350) - 350;
                // 이미지 UI 요소 생성
                Image imageUI = Instantiate(imagePrefab, pos);

                // 이미지 위치 설정
                RectTransform rectTransform = imageUI.GetComponent<RectTransform>();
                rectTransform.anchoredPosition = new Vector2(posX, posY);

                // 아이템 데이터로 UI 업데이트 (예: 이미지 스프라이트 설정)
                Image[] childImages = imageUI.GetComponentsInChildren<Image>(); // 자식 오브젝트에서 모든 Image 컴포넌트 가져오기
                foreach (Image childImage in childImages)
                {
                    if (childImage.name == "itemImage")
                    {
                        childImage.sprite = ItemData.itemImage;
                        break; // 이미지를 찾았으면 루프 종료
                    }
                }

                TMP_Text childText = imageUI.GetComponentInChildren<TMP_Text>(); // 자식 오브젝트에서 text 컴포넌트 찾기
                if (childText != null)
                {
                    childText.text = ItemData.itemName; // itemName 변경
                }    
    }
}

아이템 리스트를 받아와서 타입에 맞춰서 UIManager가 위치를 계산해서 아이템을 생성해주는 코드입니다.
실행해보니 원하는 모양으로 잘 작동하는 것 같습니다.