TableView.ts 翻译 Cocos2dx 的 cc.TableView

之前一直做Cocos2dx开发的TableView用得比较多,自己也扩展了一些功能,新公司用的Creator,所以翻译了个ts版本的,核心代码和函数名与cocos2dx的一致。

之前想过用继承ScrollView来翻译,但是在 Inspector里面有些属性直接暴露出来用visible都没法隐藏,就改成单独的组件,用requireComponent来包涵依赖的ScrollView

注意:
1、cell 的锚点是 0.5, 0.5
2、支持为每个cell设置size
3、只支持垂直滚动或水平滚动,不支持双向滚动

函数:
1、设置单元格间距的 setInterval
2、reloadData 函数增加参数,是否使用上一次的容器偏移量
3、查找索引处的单元格 cellAtIndex
4、更新索引处的单元格 updateCellAtIndex
5、滚动到索引处的单元格 scrollToIndex

未翻译2dx的函数:
1、指定索引处插入新单元格 insertCellAtIndex
2、删除指定索引处的单元格 removeCellAtIndex

使用方法:


文件:
TableView.zip (3.9 KB)

5赞

大佬牛逼“”“”“”

写了个例子

TableViewExample.zip (66.7 KB)

2赞

好东东!!!2dx时代利器!

战略mark~~

大哥的项目能直接是一个能打开的工程就好了
现在打开还要自己重新拖。。

…兄弟饭都做好了 你还想让人家喂你吃…

我是拖好了才反馈一下。。。
怎么说呢。。这里新手还是比较多的。。

1赞

例子下面有个zip包,创建一个新工程把zip包导入就行了

膜拜大佬 :grinning:

写例子的时候遇到个小bug,在节点active=false,TableView的onLoad函数没调用,再调用reloadData的时候会报错。

上传了个修复后的
TableView.zip (4.0 KB)

该TableView的实现原理,reloadData 的时候会调用 tableCellSize 回调去计算 cell 的位置保存在类型为 number[] 的数组中,然后刷新 content 的大小,滚动的时候用二分查找位置数组,计算可视区域的开始索引和结束索引,刷新这2个索引区间的 cell

2赞

老哥好东西,收下了

大佬有3.8的版本吗?

3.8.x版本的
TableView.zip (4.3 KB)

:+1:
谢谢大佬~

大佬能加一下从右往左填充吗?
我让豆包帮我加,结果显示不出来。。。 :worried:

你搜索下 VerticalFillOrder 按照这个加个左右填充就行了,就只是设置下位置而已

好的~
我去试试~

我的项目也要用从右往左滑动,增加了这个功能
序列化数据没变
要看改动的地方 把上一个包下载下来对比下
TableView.zip (4.4 KB)

下面这个组件是通过节点名渲染分组,减少Draw Call
把该组件挂到 content 节点上
有 Label 组件需 CacheMode 改为 CHAR
RenderGrouping.zip (1.0 KB)

没挂和挂上 RenderGrouping 对比图
QQ20251015-182526

QQ20251015-182547