init

list-3x/assets/home/home.ts

@@ -0,0 +1,53 @@
+import { _decorator, Component, Label, math, Node } from 'cc';
+import { YXCollectionView } from '../lib/yx-collection-view';
+import { YXTableLayout } from '../lib/yx-table-layout';
+const { ccclass, property } = _decorator;
+
+class Data {
+    id: number
+}
+
+@ccclass('home')
+export class home extends Component {
+
+    @property(YXCollectionView)
+    listComp: YXCollectionView = null
+
+    testData: Data[] = []
+
+    protected start(): void {
+
+        // 绑定数据源
+        this.listComp.numberOfItems = () => this.testData.length
+        this.listComp.cellForItemAt = (indexPath, collectionView) => {
+            const rowData = this.testData[indexPath.item]
+            const cell = collectionView.dequeueReusableCell(`cell`)
+            cell.getChildByName('label').getComponent(Label).string = `${indexPath}`
+            return cell
+        }
+
+        // 确定布局方案  
+        let layout = new YXTableLayout()
+        layout.spacing = 20
+        layout.itemSize = new math.Size(400, 100)
+        this.listComp.layout = layout
+
+        this.receivedData()
+    }
+
+    /**
+     * 模拟收到数据  
+     */
+    receivedData() {
+        this.testData = []
+        for (let index = 0; index < 1000; index++) {
+            let data = new Data()
+            data.id = index
+            this.testData.push(data)
+        }
+
+        // 刷新列表
+        this.listComp.reloadData()
+    }
+}
+