乱蚣 发表于 2025-5-30 20:12:17

高性能虚拟列表

本组件提供了一整套虚拟列表解决方案,适用于需要展示大量数据的场景,确保列表在高性能和低消耗下流畅运行。
开发环境


[*]引擎版本:Cocos Creator 3.x/2.x
[*]编程语言:TypeScript
适配平台

微信小游戏Android原生iOS原生抖音小游戏OPPO小游戏vivo小游戏✔✔✔✔✔✔效果展示


[*]多种布局,节点复用


[*]支持多模板模式

[*]动态调整Item尺寸

[*]定向跳转,动态居中

[*]更新指定Item数据

[*]动态插入Item到指定位置

[*]动态删除指定位置的Item

体验地址

网页版-虚拟列表在线体验
主要功能点


[*]使用简单:使用简洁,注释清晰

[*]多种布局:垂直、水平、网格、多模板布局

[*]自适应刷新频率: 减少运算,提高性能

[*]自定义缓存区大小: 提前加载,避免卡顿

[*]自适应性能参数:性能参数,自适应计算

[*]自定义模板:注册不同模板类型

[*]分帧加载:通过分帧加载技术,避免一次性加载大量数据导致的性能问题,确保界面流畅。
[*]节点池管理:使用节点池管理机制,复用节点,减少频繁创建和销毁节点带来的性能开销。
[*]防抖动处理:在滚动事件中加入防抖动处理,避免频繁触发更新操作,提高性能。
[*]动态修改Item数据并更新:支持动态修改列表项的数据,并实时更新显示内容。
[*]动态修改Item尺寸:支持动态修改列表项的尺寸,并自动调整布局。
[*]高度复用:通过节点池和分帧加载机制,实现节点的高度复用,减少内存占用。
[*]低Drawcall:优化渲染流程,减少Drawcall次数,提高渲染性能。
使用教程


[*]初始化虚拟列表

[*]数据驱动刷新列表

[*]触发Item回调

常用接口


[*]ReloadData:重载数据,刷新列表

[*]InsertItemAt:指定位置插入Item

[*]RemoveItemAt:指定位置删除Item

[*]RegisterTemplate: 注册Item模板

[*]ScrollToIndex:滚动到指定索引项,使该项出现在屏幕正中央

[*]UpdateItemSize:更新指定索引项的尺寸

[*]UpdateItemAt:更新指定索引项的数据

[*]Refresh:刷新列表数据或尺寸变化后调用

题外话

<ul>Q:为什么用【白菜】作为Item的ICON
来源:程序园用户自行投稿发布,如果侵权,请联系站长删除
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: 高性能虚拟列表