creator 复用列表

最新推荐文章于 2024-04-21 09:48:44 发布

百味苦

最新推荐文章于 2024-04-21 09:48:44 发布

阅读量267

点赞数

分类专栏： creator

本文链接：https://blog.csdn.net/qq_38026437/article/details/117450175

版权

本文介绍了如何根据官方示例，将复用列表代码优化为支持多列展示，核心逻辑在于将滚动出屏幕的item放到即将显示的位置，重新设置数据后显示。此方案可能为复用item的最佳实践，适用于各种creator复用项目。

摘要由CSDN通过智能技术生成

根据官方示例的复用代码，改成可多列的列表

代码不多，可能是复用item的最优方案（我用的时间也不长，不是很懂）

核心逻辑很简单，就是将滚出屏幕的 item 放到将要滚到item的地方重新设置数据后显示

代码是从项目中抽出来的核心代码

只要遵循这个思路都可以使用

cc.Class({
    extends: cc.Component,

    properties: {
        itemNode: cc.Node,
        scrollView: cc.ScrollView,
    },

    // use this for initialization
    onLoad: function () {
        window.log = function () {
            this.apply(window, arguments);
        }.bind(console.log);


        this.spacing = 15;//间隔
        this.updateTimer = 0;//更新时间累加
        this.updateInterval = 0.1;//更新间隔
        this.lastContentPosY = 0; // 上滚 还是 下滚
        this.itemSize = 80;
        // 缓冲区域，半屏加1个item高度
        this.bufferZone = 250 + this.itemSize;
        this.content = this.scrollView.content;

        this.itemPool = new cc.NodePool();
        this.dataArray = [];
        this.initData();

        this.setData(