Unity3D實(shí)現(xiàn)分頁系統(tǒng)

更新時(shí)間：2020年04月15日 10:52:03 作者：即步

這篇文章主要為大家詳細(xì)介紹了Unity3D實(shí)現(xiàn)分頁系統(tǒng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

在有些情況下，有很多列表不能一次性顯示完整，需要對(duì)其進(jìn)行分頁處理

博主自己也寫了一個(gè)分頁系統(tǒng)，在這里記錄下來，方便以后直接拿來使用

這篇文章Demo也將上傳給大家下載參考：點(diǎn)擊打開鏈接

先展示下效果圖：

·效果圖一

·效果圖二

總的來說，要考慮到的邏輯情況還是有點(diǎn)的

工程目錄結(jié)構(gòu)如下圖：

在每個(gè)UIPage下有一個(gè)Image框，用來編輯當(dāng)前是那一頁，默認(rèn)activate=false

整個(gè)思路是當(dāng)點(diǎn)擊UIPage獲取里面的頁數(shù)數(shù)值，根據(jù)這個(gè)數(shù)值刷新下UIPage的Text值

在確定哪個(gè)UIPage下的Image的activate為true

將以下腳本組件掛載到UIPage上

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.UI;
 
public class UIPage : EventTrigger
{
 public Image image = null;
 public Image GetImage
 {
 get
 {
 if (image = null)
 {
 image = this.transform.GetChild(0).GetComponent<Image>();
 }
 return image;
 }
 set
 {
 image = value;
 }
 }
 
 public Text text = null;
 public Text GetText
 {
 get
 {
 if (text = null)
 {
 text = this.transform.GetChild(1).GetComponent<Text>();
 }
 return text;
 }
 set
 {
 text = value;
 }
 }
 
 
 //點(diǎn)擊UI_Page
 public override void OnPointerClick(PointerEventData eventData)
 {
 if (this.transform.GetChild(1).GetComponent<Text>().text == "..." || this.transform.GetChild(1).GetComponent<Text>().text == "")
 {
 return;
 }
 
 PageGrid pg = PageGrid.GetInstance;
 
 //如果點(diǎn)擊的是前面幾個(gè)ui（點(diǎn)擊的是1-5）
 if (int.Parse(this.transform.GetChild(1).GetComponent<Text>().text) < PageGrid.GetInstance.uiPageArray.Length)
 {
 string text = this.transform.GetChild(1).GetComponent<Text>().text;
 
 //更新顯示
 PageGrid.GetInstance.UpadateUIPageFromHead();
 
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithText(text);
 if (uiPage)
 {
 PageGrid.GetInstance.ActivatUIPageImage(this.gameObject);
 }
 }
 //點(diǎn)擊最后幾個(gè)（點(diǎn)擊的是最后4個(gè)）
 else if (int.Parse(this.transform.GetChild(1).GetComponent<Text>().text) >= PageGrid.GetInstance.maxPageIndex - 3)
 {
 string text = this.transform.GetChild(1).GetComponent<Text>().text;
 
 //更新顯示
 PageGrid.GetInstance.UpdateUIPageFromEnd();
 
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithText(text);
 if (uiPage)
 {
 PageGrid.GetInstance.ActivatUIPageImage(uiPage.gameObject);
 }
 }
 else
 {
 string text = this.transform.GetChild(1).GetComponent<Text>().text;
 
 //更新顯示
 PageGrid.GetInstance.UpdateUIPageFromMiddle(text);
 
 /*由于數(shù)字向后移動(dòng)，故image顯示位置不需要改變*/
 }
 }
}

在做完了UIPage的點(diǎn)擊事件后，需要實(shí)現(xiàn)頁面跳轉(zhuǎn)（左右按鈕的點(diǎn)擊實(shí)際也是一個(gè)跳轉(zhuǎn)）

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
 
/// <summary>
/// 管理UIPage
/// </summary>
public class PageGrid : MonoBehaviour
{
 //在初始化時(shí)最大的頁數(shù)
 public int maxPageIndex = 100;
 
 
 [HideInInspector]
 public UIPage[] uiPageArray { get; set; }
 
 private static PageGrid _instance;
 public static PageGrid GetInstance
 {
 get
 {
 if (_instance == null)
 {
 _instance = GameObject.FindGameObjectWithTag("pageGrid").GetComponent<PageGrid>();
 }
 
 return _instance;
 }
 }
 
 private void Start()
 {
 //獲取其子節(jié)點(diǎn)UIPage組件
 uiPageArray = this.GetComponentsInChildren<UIPage>();
 
 //初始化子節(jié)點(diǎn)ui顯示
 UpadateUIPageFromHead();
 }
 
 /// <summary>
 /// 在UIPage上更新
 /// </summary>
 public void UpadateUIPageFromHead()
 {
 //從一開始計(jì)數(shù)
 int headPageIndex = 1;
 
 int n_pageHeadIndex = headPageIndex;
 
 //頁數(shù)大于UIPage數(shù)（大于6）
 if (maxPageIndex > uiPageArray.Length)
 {
 foreach (var item in uiPageArray)
 {
 //倒數(shù)第二個(gè)
 if (headPageIndex - n_pageHeadIndex == uiPageArray.Length - 2)
 {
  item.transform.GetChild(1).GetComponent<Text>().text = "...";
 }
 //倒數(shù)第一個(gè)
 else if (headPageIndex - n_pageHeadIndex == uiPageArray.Length - 1)
 {
  item.transform.GetChild(1).GetComponent<Text>().text = maxPageIndex.ToString();
 }
 else
 {
  item.transform.GetChild(1).GetComponent<Text>().text = headPageIndex.ToString();
 }
 
 headPageIndex++; 
 }
 }
 //頁數(shù)等于UIPage數(shù)
 else if (maxPageIndex == uiPageArray.Length)
 {
 foreach (var item in uiPageArray)
 {
 item.transform.GetChild(1).GetComponent<Text>().text = headPageIndex.ToString();
 
 headPageIndex++;
 }
 }
 else
 {
 for (int i = 0; i < maxPageIndex; i++)
 {
 uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = headPageIndex.ToString();
 
 headPageIndex++;
 }
 }
 }
 
 
 /// <summary>
 /// 在UIPage上更新
 /// </summary>
 public void UpdateUIPageFromEnd()
 {
 //頁數(shù)大于UIPage數(shù)（大于6）
 if (maxPageIndex > uiPageArray.Length)
 {
 int count = maxPageIndex;
 for (int i = uiPageArray.Length - 1; i > 0; i--)
 {
 if (i == 0)
 {
  uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = "1";
 }
 else if (i == 1)
 {
  uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = "...";
 }
 else
 {
  uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = count.ToString();
  count--;
 }
 }
 }
 else
 {
 int count = 1;
 for (int i = 0; i < maxPageIndex; i++)
 {
 uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = count.ToString();
 count++;
 }
 }
 }
 
 /// <summary>
 /// 在UIPage中間更新
 /// </summary>
 public void UpdateUIPageFromMiddle(string number)
 {
 int count = int.Parse(number);
 for (int i = 0; i < uiPageArray.Length; i++)
 {
 if (i == 0)
 {
 uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = "1";
 }
 else if (i == 1 || i == uiPageArray.Length - 2)
 {
 uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = "...";
 }
 else if (i == uiPageArray.Length - 1)
 {
 uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = maxPageIndex.ToString();
 }
 else
 {
 uiPageArray[i].transform.GetChild(1).GetComponent<Text>().text = count.ToString();
 count++;
 }
 }
 }
 
 
 
 //需要和服務(wù)器交互TODO
 public void ActivatUIPageImage(GameObject uiPage)
 {
 //將全部uiPage的Image取消激活
 foreach (var item in uiPageArray)
 {
 item.transform.GetChild(0).gameObject.SetActive(false);
 }
 
 uiPage.transform.GetChild(0).gameObject.SetActive(true);
 }
 
 /// <summary>
 /// 按文本內(nèi)容查詢
 /// </summary>
 /// <param name="text"></param>
 public UIPage FindUIPageWithText(string text)
 {
 foreach (var item in uiPageArray)
 {
 if (item.transform.GetChild(1).GetComponent<Text>().text == text)
 {
 return item;
 }
 }
 
 return null;
 }
 
 private UIPage FindUIPageWithImage()
 {
 foreach (var item in uiPageArray)
 {
 if (item.transform.GetChild(0).gameObject.activeInHierarchy)
 {
 return item;
 }
 }
 
 return null;
 }
 
 
 /// <summary>
 /// 頁面跳轉(zhuǎn)
 /// </summary>
 public void JumpPage()//這里用于輸入框回車事件
 {
 //獲取輸入信息
 string number = GameObject.FindGameObjectWithTag("PageInputField").GetComponent<InputField>().text;
 if (string.IsNullOrEmpty(number))
 {
 return;
 }
 
 
 //查詢前面幾個(gè)ui（點(diǎn)擊的是1-4）
 if (int.Parse(number) < PageGrid.GetInstance.uiPageArray.Length - 1)
 {
 PageGrid.GetInstance.UpadateUIPageFromHead();
 
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithText(number);
 if (uiPage)
 {
 GameObject obj = uiPage.gameObject;
 
 PageGrid.GetInstance.ActivatUIPageImage(obj);
 }
 }
 //查詢最后幾個(gè)（點(diǎn)擊的是最后4個(gè)）
 else if (int.Parse(number) >= PageGrid.GetInstance.maxPageIndex - 3)
 {
 PageGrid.GetInstance.UpdateUIPageFromEnd();
 
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithText(number);
 if (uiPage)
 {
 GameObject obj = uiPage.gameObject;
 
 PageGrid.GetInstance.ActivatUIPageImage(obj);
 }
 }
 else
 {
 UpdateUIPageFromMiddle(number);
 
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithText(number);
 if (uiPage)
 {
 GameObject obj = uiPage.gameObject;
 
 PageGrid.GetInstance.ActivatUIPageImage(obj);
 }
 }
 }
 
 
 /// <summary>
 /// 跳轉(zhuǎn)
 /// </summary>
 /// <param name="str"></param>
 public void JumpPage(string str)
 {
 //獲取輸入信息
 string number = str;
 
 
 //查詢前面幾個(gè)ui（點(diǎn)擊的是1-4）
 if (int.Parse(number) < PageGrid.GetInstance.uiPageArray.Length - 1)
 {
 PageGrid.GetInstance.UpadateUIPageFromHead();
 
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithText(number);
 if (uiPage)
 {
 GameObject obj = uiPage.gameObject;
 
 PageGrid.GetInstance.ActivatUIPageImage(obj);
 }
 }
 //查詢最后幾個(gè)（點(diǎn)擊的是最后4個(gè)）
 else if (int.Parse(number) >= PageGrid.GetInstance.maxPageIndex - 3)
 {
 PageGrid.GetInstance.UpdateUIPageFromEnd();
 
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithText(number);
 if (uiPage)
 {
 GameObject obj = uiPage.gameObject;
 
 PageGrid.GetInstance.ActivatUIPageImage(obj);
 }
 }
 else
 {
 UpdateUIPageFromMiddle(number);
 
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithText(number);
 if (uiPage)
 {
 GameObject obj = uiPage.gameObject;
 
 PageGrid.GetInstance.ActivatUIPageImage(obj);
 }
 }
 }
 
 /// <summary>
 /// 頁面選擇按鈕
 /// </summary>
 /// <param name="selection">（向左：-1）（ 向右：1）</param>
 public void OnBtnRight(string selection)
 {
 UIPage uiPage = PageGrid.GetInstance.FindUIPageWithImage();
 if (uiPage)
 {
 //當(dāng)前頁面是最后一頁或者是第一頁
 if (int.Parse(uiPage.transform.GetChild(1).GetComponent<Text>().text) == maxPageIndex && selection == "1" || int.Parse(uiPage.transform.GetChild(1).GetComponent<Text>().text) == 1 && selection == "-1")
 {
 return;
 }
 else
 {
 //跳轉(zhuǎn)頁面
 JumpPage((int.Parse(uiPage.transform.GetChild(1).GetComponent<Text>().text) + int.Parse(selection)).ToString());
 }
 }
 }
}

將該腳本掛載到父節(jié)點(diǎn)pageGrid上