当前位置: 移动技术网 > IT编程>开发语言>c# > unity实现翻页按钮功能

unity实现翻页按钮功能

2020年06月23日  | 移动技术网IT编程  | 我要评论

本文实例为大家分享了unity实现翻页按钮功能的具体代码,供大家参考,具体内容如下

效果图:

ui子父级关系:

代码中也都有加入注释,有不懂可私信我。脚本中用到了对象池,我没有上传,可根据自己需求做相应变动。

脚本:pagebtnpanelc

using system.collections;
using system.collections.generic;
using unityengine;
using unityengine.events;
using unityengine.ui;
/// <summary>
/// 分页按钮面板控制器
/// </summary>
public class pagebtnpanelc : monobehaviour {
 private horizontallayoutgroup self_hlg;
 /// <summary>
 /// 上一页按钮
 /// </summary>
 private button lastpagebtn;
 /// <summary>
 /// 下一页按钮
 /// </summary>
 private button nextpagebtn;
 /// <summary>
 /// 页数的父物体
 /// </summary>
 private recttransform pagebtnparent;
 private horizontallayoutgroup pagebtnparent_hlg;
 /// <summary>
 /// 上一页按钮点击事件
 /// </summary>
 private unityaction<int> lastpagebtnevent;
 /// <summary>
 /// 下一页按钮点击事件
 /// </summary>
 private unityaction<int> nextpagebtnevent;
 /// <summary>
 /// 当前显示页面的下标
 /// </summary>
 private int _currentshowpageindex = 1;
 public int currentshowpageindex {
  get {
   return _currentshowpageindex;
  }
  set {
   _currentshowpageindex = value;
  }
 }
 /// <summary>
 /// 总的页面数
 /// </summary>
 private int totalpagenumber = 0;
 /// <summary>
 /// 显示按钮的个数 奇数个
 /// </summary>
 [header("必须是奇数个,且小于总页数")]
 private int _showbtncount = 5;
 public int showbtncount {
  get {
   if (_showbtncount > totalpagenumber) {
    _showbtncount = totalpagenumber;
   }
 
   return _showbtncount;
  }
  set {
   if (value % 2 == 0)
   {
    _showbtncount = value - 1;
   }
   else {
    _showbtncount = value;
   }
  }
 }
 /// <summary>
 /// 页数按钮 预设体
 /// </summary>
 public gameobject btnprefabs;
 /// <summary>
 /// 页数按钮 存放list
 /// </summary>
 public list<pagebtnc> pbclist;
 
 private void start()
 {
  init();
  set(14, 9, (index1) =>
  {
   debug.log("当前显示第:" + currentshowpageindex + "页");
  }, (index2) =>
  {
   debug.log("当前显示第:" + currentshowpageindex + "页");
  }, (_pageindex, _pbc) =>
  {
   debug.log("当前显示第:" + currentshowpageindex + "页");
  });
 }
 /// <summary>
 /// 改变显示的状态
 /// </summary>
 void changeshowstate() {
  int _showbtncount = showbtncount;
  /*
   判断是否在可更新范围内,如果在更新范围内,则将currentshowpageindex设置为中心位置的按钮
   eg:假设总共有10页(totalpagenumber = 10),显示按钮的个数为7(showbtncount = 7)
   则应该在 (showbtncount / 2 + 1) = 4 到 totalpagenumber - showbtncount / 2 = 7 之间设置
   如果currentshowpageindex = 5或6
   则应该这样显示  1.. 3 4 5 6 7 ..10
   如果不在更新范围内,
   如果currentshowpageindex = 1或2或3或4  则应该这样显示: 1 2 3 4 5 6 ..10
   如果如果currentshowpageindex = 7或8或9或10 则应该这样显示 1.. 5 6 7 8 9 10
   */
  if (currentshowpageindex >= (showbtncount / 2 + 1) && currentshowpageindex <= (totalpagenumber - showbtncount / 2))
  {
   int _showbtncount2 = _showbtncount - 2;
   _showbtncount2 /= 2;
 
   //判断起始下标
   int startindex = currentshowpageindex - _showbtncount2;
   int endindex = currentshowpageindex + _showbtncount2;
 
   //防止超出
   if (startindex <= 1)
   {
    startindex = 2;
   }
   //防止超出
   if (endindex >= totalpagenumber)
   {
    endindex = totalpagenumber - 1;
   }
 
   //计算中心位置按钮的下标 因为showbtncount不定
   int centerindex = showbtncount / 2;
 
   pbclist[centerindex].set(currentshowpageindex);
 
   //循环设置前面一部分按钮信息
   for (int i = 1; i < centerindex; i++)
   {
    pbclist[i].set(startindex++);
   }
 
   //循环设置后面一部分按钮信息
   for (int i = centerindex + 1; i < showbtncount - 1; i++)
   {
    startindex++;
    pbclist[i].set(startindex);
   }
  }
  else {
   //如果点击的是小于等于4的按钮下标
   if (currentshowpageindex < (showbtncount / 2 + 1))
   {
    for (int i = 0; i < showbtncount - 1; i++) {
     pbclist[i].set(i+1);
    }
   }//如果点击的事大于等于7的按钮下标
   else if (currentshowpageindex > (totalpagenumber - showbtncount / 2)) {
 
    int startnumber = totalpagenumber - showbtncount + 2;
 
    for (int i = 1; i < showbtncount; i++) {
     pbclist[i].set(startnumber++);
    }
   }
  }
 
  /*
   判断总显示页数是否大于显示页数
   以防止出现这种效果:
   例如:totalpagenumber = 7,showbtncount =7
   防止出现的效果:1 2 3 4 5 6 ..7 和 1.. 2 3 4 5 6 7
   应该出现的效果:1 2 3 4 5 6 7
   */
  if (totalpagenumber > showbtncount){
   _showbtncount -= 2;
   _showbtncount /= 2;
   if (currentshowpageindex - _showbtncount - 1 > 1)
   {
    pbclist[0].set(1, "1..");
   }
   else
   {
    pbclist[0].set(1);
   }
   if (currentshowpageindex + _showbtncount + 1 < totalpagenumber)
   {
    pbclist[showbtncount - 1].set(totalpagenumber, ".." + totalpagenumber);
   }
   else
   {
    pbclist[showbtncount - 1].set(totalpagenumber);
   }
  }
 }
 
 private bool isinit = false;
 public void init() {
  if (isinit)
   return;
  isinit = true;
 
  pbclist = new list<pagebtnc>();
 
  self_hlg = transform.getcomponent<horizontallayoutgroup>();
 
  pagebtnparent = transform.find("pageindexparent") as recttransform;
  pagebtnparent_hlg = pagebtnparent.getcomponent<horizontallayoutgroup>();
 
  lastpagebtn = transform.find("lastpagebtn").getcomponent<button>();
  lastpagebtn.onclick.addlistener(()=> {
   if (totalpagenumber <= 0)
    return;
 
   if (currentshowpageindex > 1) {
    currentshowpageindex--;
   }
 
   resetpagebtnstate();
 
   changeshowstate();
 
   pagebtnc pbc = getpbcfromindex(currentshowpageindex);
   if (pbc != null) {
    pbc.sethighlightcolor();
   }
 
   if (lastpagebtnevent != null)
   {
    lastpagebtnevent(currentshowpageindex);
   }
  });
 
  nextpagebtn = transform.find("nextpagebtn").getcomponent<button>();
  nextpagebtn.onclick.addlistener(()=> {
   if (totalpagenumber <= 0)
    return;
 
   if (currentshowpageindex < totalpagenumber) {
    currentshowpageindex++;
   }
 
   resetpagebtnstate();
 
   changeshowstate();
   
   pagebtnc pbc = getpbcfromindex(currentshowpageindex);
   if (pbc != null)
   {
    pbc.sethighlightcolor();
   }
 
   if (nextpagebtnevent != null)
   {
    nextpagebtnevent(currentshowpageindex);
   }
 
  });
 }
 /// <summary>
 /// 设置信息
 /// </summary>
 /// <param name="totalpagenumber">总页数</param>
 /// <param name="showbtncount">显示多少个按钮,填奇数,如果填偶数,则会强制减1,如:填6,则实际为5</param>
 /// <param name="lastbtnevent">上一页按钮事件</param>
 /// <param name="nextbtnevent">下一页按钮事件</param>
 /// <param name="pagebtnclickevent">单独点击页面按钮事件</param>
 public void set(int totalpagenumber,int showbtncount,unityaction<int> lastbtnevent,unityaction<int> nextbtnevent,unityaction<int,pagebtnc> pagebtnclickevent) {
  if (totalpagenumber <= 0)
  {
   this.totalpagenumber = 1;
  }
  else {
   this.totalpagenumber = totalpagenumber;
  }
  
  this.showbtncount = showbtncount;
 
  this.lastpagebtnevent = lastbtnevent;
  this.nextpagebtnevent = nextbtnevent;
 
  currentshowpageindex = 1;
 
  pbclist.clear();
 
  for (int i = 1; i <= showbtncount; i++) {
   int index = i;
   pagebtnc pbc = poolmanager.instance.spawn(btnprefabs, pagebtnparent).getcomponent<pagebtnc>();
   if (pbc) {
    pbc.set(index,null, (pageindex,pbc111) =>
    {
     currentshowpageindex = pageindex;
 
     resetpagebtnstate();
 
     changeshowstate();
 
     pagebtnc pbc1 = getpbcfromindex(currentshowpageindex);
     if (pbc1 != null)
     {
      pbc1.sethighlightcolor();
     }
     if (pagebtnclickevent != null) {
      pagebtnclickevent(pageindex, pbc111);
     }
    });
   }
   pbclist.add(pbc);
  }
 
  pbclist[0].sethighlightcolor();
 
  changeshowstate();
 
  util.setwidth_childwidthsame(pagebtnparent_hlg, pagebtnparent);
 
  util.setwidth_childwidthnotsame(self_hlg, transform as recttransform);
 }
 /// <summary>
 /// 重置所有按钮的状态
 /// </summary>
 void resetpagebtnstate() {
  for (int i = 0; i < pbclist.count; i++) {
   pbclist[i].setnormalcolor();
  }
 }
 /// <summary>
 /// 回收所有页码
 /// </summary>
 public void unspawn() {
  for (int i = pagebtnparent.childcount - 1; i >= 0; i--) {
   
   poolmanager.instance.unspawn(pagebtnparent.getchild(i).gameobject);
  }
 }
 
 public void clear() {
  lastpagebtnevent = null;
  nextpagebtnevent = null;
 }
 /// <summary>
 /// 根据index得到pagebtnc物体
 /// </summary>
 /// <param name="index"></param>
 /// <returns></returns>
 pagebtnc getpbcfromindex(int index) {
  for (int i = 0; i < pbclist.count; i++) {
   if (pbclist[i].currentpageindex.equals(index)) {
    return pbclist[i];
   }
  }
 
  return null;
 }
}
 
public class util
{
 /// <summary>
 /// 设置物体宽度 子物体宽度相同
 /// </summary>
 /// <param name="parenthlg"></param>
 /// <param name="parent"></param>
 /// <param name="callback"></param>
 public static void setwidth_childwidthsame(horizontallayoutgroup parenthlg, recttransform parent, unityaction<float> endcallback = null)
 {
  float width = 0;
 
  float leftpadding = parenthlg.padding.left;
  float spacing = parenthlg.spacing;
 
  int childcount = parent.childcount;
 
  if (childcount > 0)
  {
   recttransform singlechildrt = parent.getchild(0) as recttransform;
 
   width = childcount * singlechildrt.rect.width + (childcount - 1) * spacing + leftpadding;
  }
 
  parent.sizedelta = new vector2(width, parent.sizedelta.y);
 
  if (endcallback != null)
  {
   endcallback(width);
  }
 }
 
 /// <summary>
 /// 设置物体宽度 子物体宽度不同
 /// </summary>
 /// <param name="parenthlg"></param>
 /// <param name="parent"></param>
 /// <param name="callback"></param>
 public static void setwidth_childwidthnotsame(horizontallayoutgroup parenthlg, recttransform parent, unityaction<float> endcallback = null)
 {
  float width = 0;
 
  rectoffset padding = parenthlg.padding;
  float spacing = parenthlg.spacing;
 
  int childcount = parent.childcount;
 
  if (childcount > 0)
  {
   for (int i = 0; i < childcount; i++)
   {
    recttransform childrt = parent.getchild(i) as recttransform;
    width += childrt.rect.width;
   }
 
   width += (childcount - 1) * spacing + padding.left + padding.right;
  }
 
  parent.sizedelta = new vector2(width, parent.sizedelta.y);
 
  if (endcallback != null)
  {
   endcallback(width);
  }
 }
}

脚本:pagebtnc

using system.collections;
using system.collections.generic;
using unityengine;
using unityengine.events;
using unityengine.ui;
/// <summary>
/// 页码按钮控制器
/// </summary>
public class pagebtnc : monobehaviour,ipool {
 /// <summary>
 /// 自己显示的页码
 /// </summary>
 private int currentpageindex = 0;
 public int currentpageindex {
  get {
   return currentpageindex;
  }
 }
 
 private button selfbtn;
 private image img;
 private text selftext;
 
 /// <summary>
 /// 按钮事件
 /// </summary>
 public unityaction<int,pagebtnc> btnclickevent;
 
 /// <summary>
 /// 按钮正常和高亮颜色
 /// </summary>
 public color normalcolor;
 public color highlightcolor;
 
 /// <summary>
 /// 文本正常和高亮颜色
 /// </summary>
 public color normaltextcolor;
 public color highlighttextcolor;
 
 private bool isinit = false;
 void init() {
  if (isinit)
   return;
  isinit = true;
 
  img = transform.getcomponent<image>();
 
  selftext = transform.find("text").getcomponent<text>();
 
  selfbtn = transform.getcomponent<button>();
  selfbtn.onclick.addlistener(()=> {
   
   if (btnclickevent != null) {
    btnclickevent(currentpageindex,this);
   }
  });
 }
 /// <summary>
 /// 设置正常颜色
 /// </summary>
 public void setnormalcolor() {
  img.color = normalcolor;
  selftext.color = normaltextcolor;
 }
 /// <summary>
 /// 设置高亮颜色
 /// </summary>
 public void sethighlightcolor() {
  img.color = highlightcolor;
  selftext.color = highlighttextcolor;
 }
 /// <summary>
 /// 设置事件 文本内容等
 /// </summary>
 /// <param name="currentpageindex"></param>
 /// <param name="selftextstr"></param>
 /// <param name="btnclickevent"></param>
 public void set(int currentpageindex,string selftextstr = null,unityaction<int,pagebtnc> btnclickevent = null) {
  this.currentpageindex = currentpageindex;
 
  if (btnclickevent != null)
  {
   this.btnclickevent = btnclickevent;
  }
 
  if (string.isnullorempty(selftextstr))
  {
   selftext.text = currentpageindex.tostring();
  }
  else {
   selftext.text = selftextstr;
  }
 }
 
 #region 对象池接口方法
 public int getmaxcount()
 {
  return 10;
 }
 
 public string singletonname()
 {
  return this.gettype().name;
 }
 
 public void spawn()
 {
  init();
 }
 
 public void unspawn()
 {
  setnormalcolor();
 }
 #endregion
}

github地址

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持移动技术网。

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网