NGUI完美高性能无限滚动

前几天项目中使用了NGUI，但对于一个一直用UGUI的攻城狮来说，无疑不是件痛苦的事。还好之前有用过一段时间，用起来还没有什么大问题，但无限滚动肯定是必须的，于是就上网上查了一下，查了半天，结果愣是没找到免费好用的。基本上都是要收积分下载的，对于总资产4个积分的穷逼博主来说，这太昂贵了，这哪里下的起哈哈。
于是索性试着写一个，尽量保证高性能，简代码，低耦合。
下面看效果图：

效果图看完了，下面贴出源码：

/*---------------------------------------------** Title: NGUI 无限滚动工具，需要配合NGUIScrollItemBase使用** Description: 只需调用InitCellData()传入数据长度，该工具会自动生成格子  *  * Author: 壹叶成名** Date: 2019.11.10** Modify: * * 注意：使用时请通过Grid或手动排列看下效果，调整好ItemParent的位置，避免因ItemParent位置原因造成其他问题
------------------------------------------------*/
using UnityEngine;
//默认指定挂载在ScrollView 上
[RequireComponent(typeof(UIScrollView))]
public class NGUIInfiniteScroll : MonoBehaviour
{//滚动视图的高private float ScrollViewHitht;//预设物public GameObject Item;//Item高public float ItemHight;//Item父物体private Transform mItemParent;//最大能显示的Item数量private int MaxItemNum;//下一个Item的索引private int NextIndex;//上一个Item的索引private int lastIndex = -1;//ScoView视图初始偏移量private float InitPanelOffect;//每个Item的偏移量private float mItemOffect;//滑动的格子偏移量private float SmoothOffectY = 1;//ScrollView视图界面private UIPanel mUIPanel;//最大长度private int MaxDataCount;// V3数据 用来重复赋值 避免多次new产生的额外销毁private Vector3 mTarget_V3 = new Vector3(0,0,0);/// <summary>/// 初始化格子数据/// </summary>/// <param name="dataCount">数据长度</param>public void InitCellData(int dataCount){InitData();MaxDataCount = dataCount;MaxItemNum = (int)(ScrollViewHitht / ItemHight) + 2;//计算最多能显示出来的Item个数if(dataCount<MaxItemNum )MaxItemNum =dataCount;mItemOffect = -ItemHight;//初始化每个Item的偏移量//生成Item池for (int i = 0; i < MaxItemNum; i++){GameObject nItem = Instantiate(Item, mItemParent);nItem.SetActive(true);mTarget_V3.y = mItemOffect * i;//循环利用V3 避免多次New造成的额外消耗nItem.transform.localPosition = mTarget_V3;nItem.GetComponent<NGUIScrollItemBase>().DataConfig(i);}NextIndex = MaxItemNum;//计算下一个Item的下标InitPanelOffect = mUIPanel.transform.localPosition.y;//初始化滚动视图的偏移量}private void InitData(){mUIPanel = GetComponent<UIPanel>();ScrollViewHitht = mUIPanel.GetViewSize().y;//获取显示面板的高度//处理Item父物体mItemParent = Item.transform.parent;UIGrid uIGrid = mItemParent.GetComponent<UIGrid>();if (uIGrid) uIGrid.enabled = false;//创建滑动监听事件，提高性能，只在滑动时处理数据，避免使用Updata造成额外的性能消耗GameObject nScrollBar = new GameObject("Scroll Bar");nScrollBar.transform.SetParent(transform);UIScrollBar scrollBar=   nScrollBar.AddComponent<UIScrollBar>();GetComponent<UIScrollView>().verticalScrollBar = scrollBar;EventDelegate @delegate = new EventDelegate(this, "StartRolling");scrollBar.onChange.Add(@delegate);}/// <summary>/// 开始滚动时处理数据/// </summary>public void StartRolling(){float CurOf_Y = mUIPanel.transform .localPosition.y;//记录当前的偏移量if (CurOf_Y >= ((ItemHight * SmoothOffectY) + InitPanelOffect) && lastIndex != NextIndex && NextIndex < MaxDataCount){SmoothOffectY++;Transform temp = mItemParent.GetChild(1).transform; //通知下一个Iten做准备float offectY = mItemParent.GetChild(MaxItemNum).transform.localPosition.y; //把最上面的移动到最下面temp.SetAsLastSibling();//设置到最下面mTarget_V3.y = offectY - ItemHight;//循环利用V3 避免多次New造成的额外消耗temp.localPosition = mTarget_V3;temp.GetComponent<NGUIScrollItemBase>().DataConfig(NextIndex);//通知配置数据lastIndex = NextIndex;//记录上次索引NextIndex++;//索引增加}if (CurOf_Y <= ((ItemHight * (SmoothOffectY - 1)) + InitPanelOffect) && lastIndex != NextIndex && SmoothOffectY >= 2){SmoothOffectY--;Transform temp = mItemParent.GetChild(MaxItemNum).transform; //通知下一个Iten做准备float offectY = mItemParent.GetChild(1).transform.localPosition.y;   //把最下面的移动到最上面temp.SetSiblingIndex(1);mTarget_V3.y = offectY + ItemHight;//循环利用V3 避免多次New造成的额外消耗temp.localPosition = mTarget_V3;temp.GetComponent<NGUIScrollItemBase>().DataConfig(NextIndex - (MaxItemNum + 1));lastIndex = NextIndex;NextIndex--;}}
}

/*---------------------------------------------** Title: NGUI 无限滚动格子Item** Description: Item只需继承此脚本，DataConfig会在格子出现时自动调用** Author: 壹叶成名** Date: 2019.11.10** Modify: *
------------------------------------------------*/
using UnityEngine;public class NGUIScrollItemBase : MonoBehaviour {/// <summary>/// 数据配置接口 /// </summary>/// <param name="index">格子下标</param>public virtual  void DataConfig(int  index){  }
}

接下来介绍下使用：
滚动工具挂在在ScrollView上拖拽赋值好自己的Item预设物和Item格子的高度 Grid下的预设物要记得隐藏掉
如下图

注意：格子的高度一定不能错
制作Item 制作好Item后隐藏Item 然后拖拽到滚动工具上，创建脚本继承NGUIScrollItemBase 重写DataConfig方法即可，每个格子会在刷新时以格子下标的方式调用DataConfig

下面是Demo测试使用的源码：
这个脚本随便挂载在物体上，拖住赋值滚动工具

using System.Collections;
using System.Collections.Generic;
using UnityEngine;public class GameManager : MonoBehaviour
{//滚动工具public NGUIInfiniteScroll scroll;public static GameManager Instance;public List<string> DataList = new List<string>();private void Awake(){Instance = this;for (int i = 0; i < 100; i++){DataList.Add("小"+i.ToString());}}void Start(){scroll.InitCellData(DataList.Count);}}

预设物脚本：

using UnityEngine;public class Item : NGUIScrollItemBase
{public UILabel label;private void Awake(){label = transform.Find("Label").GetComponent<UILabel>();}public override void DataConfig(int index){Debug.Log("index:"+ index);label.text = GameManager.Instance.DataList[index];}}

使用简单方便，要注意调整Grid的位置，也就是Item父物体。

下面附上Demo链接，有积分的兄弟欢迎多多下载！
Demo版本为2018.4
//download.csdn.net/download/qq_42461824/11969163

原创地址:https://blog.csdn.net/qq_42461824/article/details/102997823

努力积才能，壹叶便成名，喜欢我关注我！

原创出品，转载请注明出处。

NGUI完美高性能无限滚动相关推荐

【译】无限滚动加载最佳实践
本文转载自:众成翻译译者:文蔺链接:http://www.zcfy.cc/article/673 原文:https://uxplanet.org/infinite-scrolling-best-p ...
datagridview滚动条自动滚动_掘金上摸鱼的新发现，无限滚动(infinitescroll)
前言上班摸鱼,下班摸鱼,一直摸一直爽.在一次调试的过程中,我按下了F12刚好是掘金的页面,然后把代码输入到控制台之后,顺手滚动了几下右侧的滚动条,发现个问题如下图所示: ‍‍‍‍‍‍‍‍‍‍掘金官网 ...
无限滚动加载最佳实践
无限滚动加载最佳实践无限滚动(Infinite scrolling),有时候被称为无尽滚动(endless scrolling),这种技术允许用户在大量内容上滚动,眼中看不到结束的地方.这种技术很简 ...
使用RecycleView实现无限滚动的日历
最终效果项目地址一.无限滚动实现在RecyclerView.Adapter的getItemCount()方法中返回Integer.MAX_VALUE,使用RecycleView的scrollTo ...
vue2.0无限滚动加载数据插件
做vue项目用到下拉滚动加载数据功能,由于选的UI库(element)没有这个组件,就用Vue-infinite-loading 这个插件代替,使用中遇到的一些问题及使用方法,总结作记录! 安装: ...
15个非常棒的jQuery无限滚动插件【瀑布流效果】
现在,最热门的网站分页趋势之一是jQuery的无限滚动(也即瀑布流).如果你碰巧观察Pinterest的网站,如Facebook,Twitter和deviantART的,你会发现无限滚动的动作,当旧的 ...
响应式的无限滚动全屏dribbble作品集布局展示效果
来源:GBin1.com 在线演示/下载大家还记得前面分享过的两个魔术布局效果吧: 响应式的dribbble作品集魔术布局展示效果宽度自适应缩进的响应式dribbble作品集魔术布局展示效果今天 ...
Swift 4 无限滚动轮播图(UICollectionView实现)
作为一个资深(自认为)iOS程序猿,会经常用到轮播图,但是总是感觉自己实现要比直接用别人的要方便一点,并且有一些需求需要深度定制,于是想着自己封装一个可以定制化的轮播图库JCyclePictureVi ...
UICollectionView的无限滚动---妥协做法
项目中总有写比较变态的需求,我们的UI设计师有喜欢很酷的交互,其中有个需求类似这种的右侧部分是可以滚动的当然是无限滚动,这中效果只有UICollectionView的自定义布局才能实现,重写Layo ...

NGUI完美高性能无限滚动

NGUI完美高性能无限滚动相关推荐

最新文章

热门文章