Unity3D自学笔记——UGUI背包系统（二）UI设计实现及数据绑定

UI设计实现及数据绑定

目录结构

背包UI创建

pnlScrowView
背包的外层

背包的格子数量会超过UI的屏幕大小，所以需要进行滚动，UGUI创建滚动效果的界面是首先建立一个容器，容器需要一个不透明背景图片，然后添加一个ScrollRect，表示该区域是可以进行滚动操作的。再在该GameObject上添加Mask遮罩，用于隐藏超过该背景的物体。

pnlGrid
背包的里层
当背包的里层的大小（高度或宽度）超过外层大小时，则外层可以进行滚动。

GridLayout用于对Grid进行自动排序，Grid代表背包内的一个格子，长宽65X65，每一行5个格子
ContentSizeFitter，是让容器自适应内容的大小，如超过目前容器的高度，则自动增加高度，Rect Transform需要按图上设置顶部对其，否则滚动条会默认在中间
Grid

Grid和Item都被做成了Prefab,并置于了Resources目录下，用于动态创建

Grid就是一张图片，没有其他东西
Item
格子内的物品

需要展示的有Name, Icon和Count

Item上有个UIItem脚本，就是将需要显示的对象进行赋值

这里没有通过在OnStart或OnAwake里面进行transform.Find是因为在外部调用SetInfo的时候，该对象还没有执行Start或者Awake，就找不到被赋值的对象，会报空引用错误。

public class UIItem : MonoBehaviour {    public Image m_Icon;    public Text m_TxtName;    public Text m_TxtCount;    public void SetInfo(ItemEntity item)    {        this.m_TxtName.text = item.Name;        this.m_Icon.overrideSprite = Resources.Load<Sprite>(item.IconPath);        //For Test        this.m_TxtCount.text = item.StackCount.ToString();    }}

UIScene_Inventory
背包管理层，背包的所有操作在这里实现

public class UIInventory : UIScene {    public static int gridCount = 20; //背包格子数量    private GameObject m_GridPrefab; //格子预制体    private GameObject m_ItemPrefab; //物品预制体    private Transform m_PnlGrid; //背包里层    private RectTransform m_PnlGridRectTransfom; //背包里层的RectTransform，用于动态调整它的大小    private List<Transform> m_GridList = new List<Transform>(); //所有格子    public Dictionary<int, IEntity> m_ItemList; //从缓存里取出的ItemList    protected override void Start()    {        base.Start();        InitWidget();        InitGrid();        LoadData();    }    protected override void Update()    {        base.Update();        //For Test 随机从物品中取一个物品出来，目前物品只有2个        if (Input.GetMouseButtonDown(1))        {            int[] temp = new int[2];            for (int i = 0; i < m_ItemList.Count; i++)            {                temp[i] = m_ItemList.ToList()[i].Key;            }            int rd = Random.Range(0, 2);            AddItem(temp[rd]);        }    }    private void InitWidget()    {        this.m_GridPrefab = (GameObject)Resources.Load("Inventory/Grid");        this.m_ItemPrefab = (GameObject)Resources.Load("Inventory/Item");        this.m_PnlGrid = this.transform.Find("pnlScrowView/pnlGrid");        this.m_PnlGridRectTransfom = m_PnlGrid.GetComponent<RectTransform>();    }    private void InitGrid()    {        //动态创建Grid        for (int i = 0; i < gridCount; i++)        {            GameObject grid = GameObject.Instantiate(this.m_GridPrefab);            grid.transform.SetParent(m_PnlGrid);            m_GridList.Add(grid.transform);        }    }    private void LoadData()    {        m_ItemList = PhotonDataCache.GetAll(PhotonCacheType.ItemList);    }    public Transform GetEnmptyGrid()    {        return m_GridList.Find(x => x.childCount == 0);    }    public void AddItem(int id)    {        Transform grid = GetEnmptyGrid();        if (grid == null)            return;        if (!m_ItemList.ContainsKey(id))            return;        ItemEntity item = m_ItemList[id] as ItemEntity;        GameObject go = GameObject.Instantiate(this.m_ItemPrefab);        go.GetComponent<UIItem>().SetInfo(item);        go.transform.SetParent(grid);        go.transform.localPosition = Vector3.zero;        go.transform.localScale = Vector3.one;    }}

添加物品搞定