前言

进入公众号回复 listview 即可取得 demo 的 git 地址。

1. 之前写的一篇文章《Creator 之 ScrollView 那些事》中提到了官网 Demo 中提供的 ListViewCtl, 只是实现了纵向滑动，没有实现横向滑动。并且倡议官网能够把性能做全而后放入组件库中供开发者应用。
2. 而后有个牛逼大神说这个 ListView 不 ok。要我对本人的公众号内容负责。我还认为有什么重大的 bug，其实是打断了合批操作。对于官网提供的 ListViewCtr 的操作形式必定会打断合批的 ! 不过对于一些简略的需要，比方我上次文章中的这个截图。

这样的列表须要合批吗？我的需要就是少创立几个节点就能够了。所以我感觉 ok 不 ok 还是要看需要吧！为什么 tableview 呼声那么高，而 Laya 也在官网组件中反对了 ListView，曾经是很好的阐明了。

ListView 的局限

1. 首先，这个 ListView 是有局限的，它间接将 Item 放入了 content 中，必定会打断合批操作；

如果你有一个多列多行，并且 item 非常复杂的需要，那么用这个 ListView 必定是不适合的。就好比你用一把杀鸡的刀去杀一头牛，不喜剧才怪！所以大家在看到他人分享货色的时候倡议最好不要拿来主义，而是通过剖析后决定用还是不必，我置信作为程序猿，这点判断能力还是有的！

1. 其次，这个 ListView 不反对网格显示。如果想要多行或者多列显示，须要本人在一个 Item 中排列好。而后本人设置每个道具的显示与暗藏，所以对于有多列显示需要的状况还是比较复杂的。

那么我先说说 ListView 采纳的原理，而后再说说如何改良吧。

ListView 采纳的原理

1. 依据可显示区域的宽或者高计算出须要创立的道具的数量。而后多加一行或者一列，防止滑动的时候显示不天然。

1. 滑动时，将来到可见区域的道具放到与滑动方向相同的一端重复使用。

1. 原理其实就这么两点，目标就是少创立节点。

反对网格显示的 ListView——GridListView

1. 首先我为之前的 ListView 减少了网格显示能力，代码中通过给定的 spaceX 和 spaceY 联合可显示区域的宽或者高计算可显示的列数或者行数

1. 如果只是做了网格显示能力而不做分层治理其实一样有局限 1。尽管比你间接把道具放入 content 中好很多，然而 dc 仍然很高。

反对分层治理的 ListView——GridLayerListView

1. GridLayerListView 是继承了 GridListView，重写了设置坐标和增加节点的办法。

1. 这里的 item 仍然被增加到了 content 中，只是此时的它曾经没有子节点了，只是用来判断是否来到显示区域而存在的。
2. 同时在增加 item 的时候给 item 自定义了一个 LIST 属性，用于保留子节点的援用，因为曾经不能通过 item 的 children 数组取得子节点了。
3. 为每个子节点自定义一个属性 INIT_POS，保留本地坐标，更新地位的时候会用到。

1. 为了保障所有节点显示地位的正确性，代码中间接移除节点中存在的 widget 组件。

1. 当你将一个 ScrollView 拖到界面上时，只须要调整 ScrollView 和 view 的宽高，代码中间接删除了默认的 item 节点

1. GridLayerListView 并没有应用对象池，如果的确有须要能够在 getItem 函数中本人通过对象池获取道具。

1. 通过设置 ScrollView 的 Horizontal 和 Vertical 扭转滚动方向，同时只反对一个方向滚动。

应用形式

1. 将一个 ScrollView 拖到界面中，挂上 GridLayerListView 组件

1. 定义一个解决逻辑的组件挂到界面上，并在逻辑组件中申明好应用的变量和函数，设置好 GridLayerListView 的参数。（其实跟 ListViiew 的应用形式是一样的）

1. 设置 ScrollView 和 View 的宽高，留神尤其是 View 的宽高，因为 View 大小就是可见区域，代码中会依据 View 的宽高判断应该显示的列数或者行数。留神列数或者行数等于宽度或者高度 /（item 的宽度或者高度 + 横向间距或者纵向间距）

应用成果

为了看优化的成果，用到的两个纹理都去掉了 Packable 选项

1. 不分层的 GridListView dc=64

在不分层治理的状况下，道具中的 label 是否设置为 Char 模式 dc 都是一样的。

1. 分层 +Label 不为 Char 模式 dc=23

1. 分层 +Label 为 Char 模式 dc=9

1. 道具的预制体构造

1. 道具应用状况

依据后盾输入能够看出，一共有 35 个须要显示的道具，实际上只创立了 3 x5 = 15 个道具就搞定了。

1. dc 从 64 缩小到 9，仍然用上了 ListView 少创立，反复利用的原理，只是加上分层管，达到了这样的成果，还算过得去吧。

结语

1. 以上是我在之前的 ListView 根底上增加了网格显示，分层治理等能力后写进去的新组件，我给它起名叫 GridLayerListView，是因为它是一个反对网格显示，分层治理节点的 ListView。一个既能够杀鸡也能够杀牛的刀。就是对 ListView 情有独钟，没方法了。
2. 我并没有说这个是最优的计划，也不保障没有 bug（我还不是一个敢说本人写的货色没 bug 的牛人），思维仅供参考，大神能够绕道。如果你想将 dc 降到更低，那么你还须要做一些其余的优化。倡议浏览文弱书生陈皮皮的《Cocos Creator 性能优化：DrawCall》

进入公众号回复 listview 即可取得 demo 的 git 地址。

欢送扫码关注公众号《微笑游戏》，浏览更多内容。如果您感觉文章还能够，点赞、在看、分享、资助都是对我最大的激励，在下将感激不尽。

欢送扫码关注公众号《微笑游戏》，浏览更多内容。