0421_ TestUIStage // 데이터 가져와서 사용하고 팝업에 띄우기

목표

 

버튼을 누르면 데이터가 로드가 되고 

그 로드된 데이터 기반으로 스테이지에 대한 정보와 보상이 나오는 것을 테스트해본다.

 

 

0. 먼저 클릭을 할 버튼을 만들어 준다.

 

 

저 버튼을 누르면 팝업을 뜨면서 데이터가 로드가 되는 시스템으로 만들 것이다.

 

1. TestUIStageItem에 대한 스크립터를 만들어 준다 .

 

id 값은 데이터에서 받아야하지만, 우리는 일단 직접 넣어주기로 함.

txtStageNo 는 현재 버튼에 나오는 스테이지 관한 정보

클릭을 하기 위해서 버튼을 받는다.

 

Init 초기화 부분

 public void Init()
    {
        var data = DataManager.GetInstance().dicStageDatas[this.id];
        this.txtStageNo.text = data.stage_no.ToString();
    }

 

Datamaneger를 사용해서 dicStageDatas에 대하여 키값으로 id를 넣고, 값(data // StageDatas 파일에 대한 정보 값)을 받아온다

 

그래서 현재 txtStageNo의 text 부분에 data.stage_no 을 넣어준다. // text는 문자열이기 때문에 Tostring();으로 바꿔서 

 

 

 

2. DataManager 싱글턴을 활용해서 데이터를 가져오고 딕셔너리로 받아줍니다. 

먼저 딕셔너리를 만들어 줍니다. <키는 인트로, ★값은 매핑이되는 데이터의 형식으로>

 

 --> 맵핑이 되는 데이터의 스크립터를 만들어 줘야합니다.

 

 

 

   2-1. 딕셔너리에서 값으로 들어갈 데이터의 맵핑 스크립터 만들기

     ※ 만들어준 데이터와 이름이 똑같아야한다 !

 

 

 

StageData

 이런 맵핑 데이터는 모노비헤이어나 using를 크게 사용하지 않기 때문에 이런식으로 사용을 합니다.

RewardData

ItemData

 

 

3.  Datamanager 싱글턴에서 로드하는 메서드를 만들어 줍니다.

 

 

  var path = Resources.Load<TextAsset>("Datas/stage_data");

유니티 내에서 리소스 폴더를 만들고, 그 안에 Datas 폴더 안에 자료를 넣었습니다.

Resources.Load<TextAsset>(경로); // TextAsset를 써줘야함!  텍스트 자료를 가져오는 거라서

 

        var json = path.text;

path.text; 만 가져와서 json변수로 받아줍니다.

 

this.dicStageDatas = JsonConvert.DeserializeObject<StageData[]>(json).ToDictionary(x => x.id);

역직렬화를 해주고 ToDictionarty를 해주어서 바로 딕셔너리화를 시켜줘서 변수에 넣어줍니다.

 

이제부터 사용하거나 불러올때는 싱글턴으로 불러와서 사용을 해주시면 됩니다.

 

 

 

4. 팝업이 되는 창을 만들어줍니다. (이건 테스트 이기때문에 간단하게 만듭니다.)

 

 

캔버스의 제목을 UIStageReady 으로해주고, 

똑같이 UIStageReady 스크립터를 만들어서 붙여줍니다.

 

5.  UIStageReady 스크립터를 수정해줍니다.

 

 

 

먼저 팝업창에서 변화가 있는  데이터들을 퍼블릭으로 뚫어 받아줍니다.

 

 

Init 초기화 메서드를 만들어서 변수를 외부에서 받아서 현재 스크립터에서 변화하게 만들어 줍니다. 

 

 

  public void Init(int stageNo, string mission, params Sprite[] icons)
    {
        this.txtStegeNum.text = stageNo.ToString();
        this.txtMission.text = mission;
        for (int i = 0; i < rewardItemIcons.Length; i++) {
            var img = rewardItemIcons[i];
            img.sprite = icons[i];
        }
    }

 

int stageNo 는 현재 받은  StageNum 텍스트의 text 컴포넌트를 변경해줍니다 .

(text는 스트링이기 때문에 ToString() 으로 변경

 

string mission 은 미션에 대한 문자열을 받습니다.

 

params Sprite[] 를 배열로 외부에서 받아서 현재 변수로 있는 Image 배열로 sprite를 넣고 있습니다 .

 

 

 

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

Open 메서드는 간단하게, 호출될시 현재 오브젝트를 활성화하게 해서 열리게 해줍니다 .

 

 

 

6. 세팅은 어느정도 끝났고, 이제 이것들을 관리해주는 main 개념인 스크립터를 만들어줍니다 .

 

 

빈 게임 오브젝트를 만들어주고,  TestStage 스크립터를 만들어줘서 그 안에 넣어줍니다. 

 

 

7. main 스크립터(TestStage) 수정하기 

 

앞서 위에서 만든 UI들을 변수로 받습니다.

그리고 Atlas를 이용해서 스프라이트를 넣어줄 겁니다. 

(현재 우리가 하는 프로젝트는 이미 아틀라스가 만들어져있지만, 없으면 만들어야합니다. )

 

 

7-1 데이터를 로드하고, 로드한 데이터를 기반으로 값들을 넣어준다 .

 

 

    void Start()
    {
        DataManager.GetInstance().LoadDatas();

 

시작시 Datamanager.GetInstance().LoadDatas(); 를 호출해준다. (데이터매니저는 싱글턴이기 때문에 어디서든 접근이 가능하다. // 시작할때 먼저 데이터를 불러와준다.)

 

 

        item.Init();

 

item(// 처음의 그 네모난 버튼을 의미함). Init(); // 초기화를 먼저해줍니다. 

 

 

참고로 Init은 그 위치에있는 stageNo 를 바꿔주는 메서드 이다.

 

 

 item.btn.onClick.AddListener(() => {
            var stageData = DataManager.GetInstance().dicStageDatas[item.id];
            Debug.LogFormat("{0}  :  {1}", stageData.stage_no, stageData.mission);

 

그리고 클릭이 들어오면 TestUIStageItem.id을 키 값으로 stageDatas 딕셔너리에 값을 가져온다. 

(var stageData에 값이 담김)

 

출력을 해보면 정상적으로 출력이되는걸 볼 수 있다. 

 

 

 

            var rewardData = DataManager.GetInstance().dicRewardDatas[stageData.reward_id];
            var item0Data = DataManager.GetInstance().dicItemData1s[rewardData.item_0_id];
            var item1Data = DataManager.GetInstance().dicItemData1s[rewardData.item_1_id];
            var item2Data = DataManager.GetInstance().dicItemData1s[rewardData.item_2_id];
            

 

rewardData 도  stageData.reward_id 를 키값으로 값을 받는다.

 

itemData 도 rewardData의 키 값으로 값을 받아준다.

 

 

Debug.LogFormat("{0} : {1} : {2} : {3}", item0Data.id, item0Data.name, item0Data.sprite_name, rewardData.item_0_amount);
            Debug.LogFormat("{0} : {1} : {2} : {3}", item1Data.id, item1Data.name, item1Data.sprite_name, rewardData.item_1_amount);
            Debug.LogFormat("{0} : {1} : {2} : {3}", item2Data.id, item2Data.name, item2Data.sprite_name, rewardData.item_2_amount);

출력을 해준다.

 

 

정상적으로 출력이 되는거 볼 수 있다. 

 

 

 

            var sp1 = this.atlas.GetSprite(item0Data.sprite_name);
            var sp2 = this.atlas.GetSprite(item1Data.sprite_name);
            var sp3 = this.atlas.GetSprite(item2Data.sprite_name);

 

 

itemData에 들어있는 스프라이트 네임으로 GetSprite를 해주고 var sp1 변수로 담아준다.

 

 

 

  this.uIStageReady.Init(stageData.stage_no, stageData.mission, sp1, sp2, sp3);
            this.uIStageReady.Open();

uIStageReady (팝업 창)에 초기화에 값들을 던져준다. 

 

 

이 곳으로 값이 들어가서 팝업의 UI 변경시켜줄 것이다.

 

 

 

 

 

 

 

잘 작동이 되는 걸 볼 수 있다.