[4.23] 가로로 드래그되는 ScrollView

결과물

Scroll View의 컴포넌트

 

UICoinShop.cs

버튼이 여러개라 코드가 좀 더럽다.

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.U2D;

public class UIShopCoin : MonoBehaviour
{
    public enum eBudget
    {
        Gold, Gem, SoulGem
    }

    public Transform horizontalPos;
    public GameObject prefab;
    public SpriteAtlas atlas;
    public Button[] btns;
    public eBudget status;
    // Start is called before the first frame update
    void Start()
    {
        DataManager.Instance.GetData();                             //데이터 불러오기
        this.status = eBudget.Gold;                                 //첫 페이지는 Gold
        this.Init(0);                                               //첫 페이지 로딩
        for (int i = 0; i < this.btns.Length; i++)
        {
            int idx = i;
            btns[idx].onClick.AddListener(() =>                     //각 페이지 버튼마다 이벤트 적용
            {
                if(idx != (int)this.status)                         //같은 버튼을 눌렀을 때 작동하지 않게한다.
                {
                    for (int i = 0; i < horizontalPos.childCount; i++)
                    {
                        Destroy(horizontalPos.GetChild(i).gameObject);  //전의 페이지에 있던 요소들을 모조리 삭제
                    }
                    this.Init(idx);                                     //해당 페이지 진행
                    this.status = (eBudget)idx;                         // 페이지 저장
                }
            });
        }
    }

    private void Init(int idx)
    {
        this.ChangeStatus(idx);                                     //메뉴부분 버튼 스프라이트를 변경함
        if (idx == (int)eBudget.Gold)
        {                        
            foreach (var i in DataManager.Instance.arrShop)         //Directory의 크기만큼 프리팹을 만들어서 Json데이터와 연동시켜 생성
            {
                if (i.Value.budget_type != (int)eBudget.Gold) continue;     //Budget Type이 Gold인 것만 출력
                var go = Instantiate(this.prefab, this.horizontalPos);
                go.GetComponent<UIShopData>().Init(this.atlas.GetSprite(DataManager.Instance.arrThumb[i.Value.thumbNum].path), this.atlas.GetSprite(DataManager.Instance.arrThumb[612].path),
                    i.Value.cost_type, i.Value.amount, i.Value.bonus, i.Value.cost);               //프리팹 초기화
            }
        }
        else if (idx == (int)eBudget.Gem)
        {
            foreach (var i in DataManager.Instance.arrShop)
            {
                if (i.Value.budget_type != (int)eBudget.Gem) continue;      //Budget Type이 Gem인 것만 출력
                var go = Instantiate(this.prefab, this.horizontalPos);
                go.GetComponent<UIShopData>().Init(this.atlas.GetSprite(DataManager.Instance.arrThumb[i.Value.thumbNum].path), this.atlas.GetSprite(DataManager.Instance.arrThumb[613].path),
                    i.Value.cost_type, i.Value.amount, i.Value.bonus, i.Value.cost);
            }
        }
        else
        {
            foreach (var i in DataManager.Instance.arrShop)
            {
                if (i.Value.budget_type != (int)eBudget.SoulGem) continue;  //Budget Type이 Soul Gem인것만 출력
                var go = Instantiate(this.prefab, this.horizontalPos);
                go.GetComponent<UIShopData>().Init(this.atlas.GetSprite(DataManager.Instance.arrThumb[i.Value.thumbNum].path), this.atlas.GetSprite(DataManager.Instance.arrThumb[612].path),
                    i.Value.cost_type, i.Value.amount, i.Value.bonus, i.Value.cost);
            }
        }
    }

    private void ChangeStatus(int index)                 //메뉴부분 버튼 스프라이트를 변경함
    {
        this.horizontalPos.position = new Vector2(0, this.horizontalPos.position.y);            //초기좌표로 이동
        for (int i = 0; i < this.btns.Length; i++)
        {
            if (i == index)
            {
                this.btns[i].transform.GetChild(0).GetComponent<Image>().sprite = this.atlas.GetSprite(DataManager.Instance.arrThumb[615].path);
            }
            else
            {
                this.btns[i].transform.GetChild(0).GetComponent<Image>().sprite = this.atlas.GetSprite(DataManager.Instance.arrThumb[614].path);
            }
        }
    }
}

 

Prefab

UIShopData.cs

using UnityEngine;
using UnityEngine.UI;

public class UIShopData : MonoBehaviour
{
    public Image thumbnail;
    public Image priceThumb;
    public Button btnBuy;
    public Sprite btnSprite1;
    public Sprite btnSprite2;
    public Text coinAmount;
    public Text price;

    public void Init(Sprite s1, Sprite s2, int costType, int coinAmount, float price)
    {
        this.thumbnail.sprite = s1;
        this.priceThumb.sprite = s2;
        this.priceThumb.SetNativeSize();
        switch (costType)
        {
            case 1:
                btnBuy.GetComponent<Image>().sprite = this.btnSprite1;
                break;
            case 3:
                btnBuy.GetComponent<Image>().sprite = this.btnSprite2;
                break;
        }

        this.coinAmount.text = coinAmount.ToString();
        this.price.text = price.ToString();
    }
}