mirror of
https://github.com/568071718/creator-collection-view
synced 2025-11-04 13:25:29 +00:00
3x 新版本
This commit is contained in:
o.o.c
@@ -23,7 +23,7 @@
|
||||
"_active": true,
|
||||
"_components": [],
|
||||
"_prefab": {
|
||||
"__id__": 13
|
||||
"__id__": 23
|
||||
},
|
||||
"_lpos": {
|
||||
"__type__": "cc.Vec3",
|
||||
@@ -54,7 +54,7 @@
|
||||
},
|
||||
"autoReleaseAssets": false,
|
||||
"_globals": {
|
||||
"__id__": 14
|
||||
"__id__": 24
|
||||
},
|
||||
"_id": "5d2f3c26-c7d2-48bd-bd13-ca5aa20a93c4"
|
||||
},
|
||||
@@ -72,21 +72,27 @@
|
||||
},
|
||||
{
|
||||
"__id__": 5
|
||||
},
|
||||
{
|
||||
"__id__": 9
|
||||
},
|
||||
{
|
||||
"__id__": 14
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 9
|
||||
"__id__": 19
|
||||
},
|
||||
{
|
||||
"__id__": 10
|
||||
"__id__": 20
|
||||
},
|
||||
{
|
||||
"__id__": 11
|
||||
"__id__": 21
|
||||
},
|
||||
{
|
||||
"__id__": 12
|
||||
"__id__": 22
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
@@ -178,7 +184,7 @@
|
||||
"_priority": 0,
|
||||
"_fov": 45,
|
||||
"_fovAxis": 0,
|
||||
"_orthoHeight": 481.3008130081301,
|
||||
"_orthoHeight": 415.3929539295393,
|
||||
"_near": 0,
|
||||
"_far": 1000,
|
||||
"_color": {
|
||||
@@ -212,7 +218,7 @@
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "list",
|
||||
"_name": "list1",
|
||||
"_objFlags": 0,
|
||||
"__editorExtras__": {},
|
||||
"_parent": {
|
||||
@@ -231,7 +237,7 @@
|
||||
"_prefab": null,
|
||||
"_lpos": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"x": -420,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
@@ -303,10 +309,11 @@
|
||||
"__id__": 8
|
||||
}
|
||||
],
|
||||
"registerSupplementaryForEditor": [],
|
||||
"_id": "540sP7RuVMr66Fyji3wiJs"
|
||||
},
|
||||
{
|
||||
"__type__": "_yx_editor_register_cell_info",
|
||||
"__type__": "_yx_editor_register_element_info",
|
||||
"prefab": {
|
||||
"__uuid__": "c8b689a4-ae47-4041-8c9c-7298939e76be",
|
||||
"__expectedType__": "cc.Prefab"
|
||||
@@ -314,6 +321,242 @@
|
||||
"identifier": "cell",
|
||||
"comp": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "list2",
|
||||
"_objFlags": 0,
|
||||
"__editorExtras__": {},
|
||||
"_parent": {
|
||||
"__id__": 2
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 10
|
||||
},
|
||||
{
|
||||
"__id__": 11
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
"_lpos": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_lrot": {
|
||||
"__type__": "cc.Quat",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0,
|
||||
"w": 1
|
||||
},
|
||||
"_lscale": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 1,
|
||||
"y": 1,
|
||||
"z": 1
|
||||
},
|
||||
"_mobility": 0,
|
||||
"_layer": 33554432,
|
||||
"_euler": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_id": "15UUoyfNhFtISYnWUZ/NMT"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.UITransform",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"__editorExtras__": {},
|
||||
"node": {
|
||||
"__id__": 9
|
||||
},
|
||||
"_enabled": true,
|
||||
"__prefab": null,
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 400,
|
||||
"height": 700
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_id": "61HeNMUnxBJ4RjTTIkj7jX"
|
||||
},
|
||||
{
|
||||
"__type__": "f94cbxum3xAsomhVNW1piY0",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"__editorExtras__": {},
|
||||
"node": {
|
||||
"__id__": 9
|
||||
},
|
||||
"_enabled": true,
|
||||
"__prefab": null,
|
||||
"mask": true,
|
||||
"scrollEnabled": true,
|
||||
"wheelScrollEnabled": true,
|
||||
"scrollDirection": 1,
|
||||
"mode": 0,
|
||||
"preloadNodesLimitPerFrame": 2,
|
||||
"frameInterval": 1,
|
||||
"recycleInterval": 1,
|
||||
"registerCellForEditor": [
|
||||
{
|
||||
"__id__": 12
|
||||
}
|
||||
],
|
||||
"registerSupplementaryForEditor": [
|
||||
{
|
||||
"__id__": 13
|
||||
}
|
||||
],
|
||||
"_id": "557IDOUVFMgaXUVLj9KNOh"
|
||||
},
|
||||
{
|
||||
"__type__": "_yx_editor_register_element_info",
|
||||
"prefab": {
|
||||
"__uuid__": "c8b689a4-ae47-4041-8c9c-7298939e76be",
|
||||
"__expectedType__": "cc.Prefab"
|
||||
},
|
||||
"identifier": "cell",
|
||||
"comp": ""
|
||||
},
|
||||
{
|
||||
"__type__": "_yx_editor_register_element_info",
|
||||
"prefab": {
|
||||
"__uuid__": "c8b689a4-ae47-4041-8c9c-7298939e76be",
|
||||
"__expectedType__": "cc.Prefab"
|
||||
},
|
||||
"identifier": "supplementary",
|
||||
"comp": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "list3",
|
||||
"_objFlags": 0,
|
||||
"__editorExtras__": {},
|
||||
"_parent": {
|
||||
"__id__": 2
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 15
|
||||
},
|
||||
{
|
||||
"__id__": 16
|
||||
}
|
||||
],
|
||||
"_prefab": null,
|
||||
"_lpos": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 420,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_lrot": {
|
||||
"__type__": "cc.Quat",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0,
|
||||
"w": 1
|
||||
},
|
||||
"_lscale": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 1,
|
||||
"y": 1,
|
||||
"z": 1
|
||||
},
|
||||
"_mobility": 0,
|
||||
"_layer": 33554432,
|
||||
"_euler": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_id": "fdY0keATpIKb8Mxuy2Wwhd"
|
||||
},
|
||||
{
|
||||
"__type__": "cc.UITransform",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"__editorExtras__": {},
|
||||
"node": {
|
||||
"__id__": 14
|
||||
},
|
||||
"_enabled": true,
|
||||
"__prefab": null,
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 400,
|
||||
"height": 700
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_id": "6agiejTfZKQIWskmHSuyHv"
|
||||
},
|
||||
{
|
||||
"__type__": "f94cbxum3xAsomhVNW1piY0",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"__editorExtras__": {},
|
||||
"node": {
|
||||
"__id__": 14
|
||||
},
|
||||
"_enabled": true,
|
||||
"__prefab": null,
|
||||
"mask": true,
|
||||
"scrollEnabled": true,
|
||||
"wheelScrollEnabled": true,
|
||||
"scrollDirection": 1,
|
||||
"mode": 0,
|
||||
"preloadNodesLimitPerFrame": 2,
|
||||
"frameInterval": 1,
|
||||
"recycleInterval": 1,
|
||||
"registerCellForEditor": [
|
||||
{
|
||||
"__id__": 17
|
||||
}
|
||||
],
|
||||
"registerSupplementaryForEditor": [
|
||||
{
|
||||
"__id__": 18
|
||||
}
|
||||
],
|
||||
"_id": "e75snCyRxN9KrcOvFeGEnP"
|
||||
},
|
||||
{
|
||||
"__type__": "_yx_editor_register_element_info",
|
||||
"prefab": {
|
||||
"__uuid__": "c8b689a4-ae47-4041-8c9c-7298939e76be",
|
||||
"__expectedType__": "cc.Prefab"
|
||||
},
|
||||
"identifier": "cell",
|
||||
"comp": ""
|
||||
},
|
||||
{
|
||||
"__type__": "_yx_editor_register_element_info",
|
||||
"prefab": {
|
||||
"__uuid__": "c8b689a4-ae47-4041-8c9c-7298939e76be",
|
||||
"__expectedType__": "cc.Prefab"
|
||||
},
|
||||
"identifier": "supplementary",
|
||||
"comp": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.UITransform",
|
||||
"_name": "",
|
||||
@@ -392,9 +635,6 @@
|
||||
},
|
||||
"_enabled": true,
|
||||
"__prefab": null,
|
||||
"listComp": {
|
||||
"__id__": 7
|
||||
},
|
||||
"_id": "acPDbfi09KmLOkYo+Irf3Y"
|
||||
},
|
||||
{
|
||||
@@ -408,25 +648,25 @@
|
||||
{
|
||||
"__type__": "cc.SceneGlobals",
|
||||
"ambient": {
|
||||
"__id__": 15
|
||||
"__id__": 25
|
||||
},
|
||||
"shadows": {
|
||||
"__id__": 16
|
||||
"__id__": 26
|
||||
},
|
||||
"_skybox": {
|
||||
"__id__": 17
|
||||
"__id__": 27
|
||||
},
|
||||
"fog": {
|
||||
"__id__": 18
|
||||
"__id__": 28
|
||||
},
|
||||
"octree": {
|
||||
"__id__": 19
|
||||
"__id__": 29
|
||||
},
|
||||
"skin": {
|
||||
"__id__": 20
|
||||
"__id__": 30
|
||||
},
|
||||
"lightProbeInfo": {
|
||||
"__id__": 21
|
||||
"__id__": 31
|
||||
},
|
||||
"bakedWithStationaryMainLight": false,
|
||||
"bakedWithHighpLightmap": false
|
||||
|
||||
@@ -1,53 +1,118 @@
|
||||
import { _decorator, Component, Label, math, Node } from 'cc';
|
||||
import { _decorator, Component, Label, math, Node, Sprite } 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.setup_list1()
|
||||
this.setup_list2()
|
||||
this.setup_list3()
|
||||
}
|
||||
|
||||
// 绑定数据源
|
||||
this.listComp.numberOfItems = () => this.testData.length
|
||||
this.listComp.cellForItemAt = (indexPath, collectionView) => {
|
||||
const rowData = this.testData[indexPath.item]
|
||||
setup_list1() {
|
||||
const listComp = this.node.getChildByName('list1').getComponent(YXCollectionView)
|
||||
|
||||
listComp.numberOfItems = () => 10000
|
||||
listComp.cellForItemAt = (indexPath, collectionView) => {
|
||||
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
|
||||
layout.rowHeight = 100
|
||||
listComp.layout = layout
|
||||
|
||||
this.receivedData()
|
||||
listComp.reloadData()
|
||||
}
|
||||
|
||||
/**
|
||||
* 模拟收到数据
|
||||
*/
|
||||
receivedData() {
|
||||
this.testData = []
|
||||
for (let index = 0; index < 1000; index++) {
|
||||
let data = new Data()
|
||||
data.id = index
|
||||
this.testData.push(data)
|
||||
setup_list2() {
|
||||
const listComp = this.node.getChildByName('list2').getComponent(YXCollectionView)
|
||||
|
||||
listComp.numberOfSections = () => 100
|
||||
listComp.supplementaryForItemAt = (indexPath, collectionView, kinds) => {
|
||||
if (kinds === YXTableLayout.SupplementaryKinds.HEADER) {
|
||||
const supplementary = collectionView.dequeueReusableSupplementary('supplementary')
|
||||
supplementary.getChildByName('label').getComponent(Label).string = `header ${indexPath}`
|
||||
const shape = supplementary.getChildByName('shape')
|
||||
shape.getComponent(Sprite).color = new math.Color(100, 100, 150)
|
||||
return supplementary
|
||||
}
|
||||
if (kinds === YXTableLayout.SupplementaryKinds.FOOTER) {
|
||||
const supplementary = collectionView.dequeueReusableSupplementary('supplementary')
|
||||
supplementary.getChildByName('label').getComponent(Label).string = `footer ${indexPath}`
|
||||
const shape = supplementary.getChildByName('shape')
|
||||
shape.getComponent(Sprite).color = new math.Color(150, 100, 100)
|
||||
return supplementary
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
// 刷新列表
|
||||
this.listComp.reloadData()
|
||||
listComp.numberOfItems = () => 20
|
||||
listComp.cellForItemAt = (indexPath, collectionView) => {
|
||||
const cell = collectionView.dequeueReusableCell(`cell`)
|
||||
cell.getChildByName('label').getComponent(Label).string = `${indexPath}`
|
||||
return cell
|
||||
}
|
||||
|
||||
let layout = new YXTableLayout()
|
||||
layout.spacing = 20
|
||||
layout.top = 20
|
||||
layout.bottom = 20
|
||||
layout.rowHeight = 100
|
||||
layout.sectionHeaderHeight = 120
|
||||
layout.sectionFooterHeight = 120
|
||||
listComp.layout = layout
|
||||
|
||||
listComp.reloadData()
|
||||
}
|
||||
|
||||
setup_list3() {
|
||||
const listComp = this.node.getChildByName('list3').getComponent(YXCollectionView)
|
||||
|
||||
listComp.numberOfSections = () => 100
|
||||
listComp.supplementaryForItemAt = (indexPath, collectionView, kinds) => {
|
||||
if (kinds === YXTableLayout.SupplementaryKinds.HEADER) {
|
||||
const supplementary = collectionView.dequeueReusableSupplementary('supplementary')
|
||||
supplementary.getChildByName('label').getComponent(Label).string = `header ${indexPath}`
|
||||
const shape = supplementary.getChildByName('shape')
|
||||
shape.getComponent(Sprite).color = new math.Color(100, 100, 150)
|
||||
return supplementary
|
||||
}
|
||||
if (kinds === YXTableLayout.SupplementaryKinds.FOOTER) {
|
||||
const supplementary = collectionView.dequeueReusableSupplementary('supplementary')
|
||||
supplementary.getChildByName('label').getComponent(Label).string = `footer ${indexPath}`
|
||||
const shape = supplementary.getChildByName('shape')
|
||||
shape.getComponent(Sprite).color = new math.Color(150, 100, 100)
|
||||
return supplementary
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
listComp.numberOfItems = () => 20
|
||||
listComp.cellForItemAt = (indexPath, collectionView) => {
|
||||
const cell = collectionView.dequeueReusableCell(`cell`)
|
||||
cell.getChildByName('label').getComponent(Label).string = `${indexPath}`
|
||||
return cell
|
||||
}
|
||||
|
||||
let layout = new YXTableLayout()
|
||||
layout.spacing = 20
|
||||
layout.top = 20
|
||||
layout.bottom = 20
|
||||
layout.rowHeight = 100
|
||||
layout.sectionHeaderHeight = 120
|
||||
layout.sectionFooterHeight = 120
|
||||
layout.sectionHeadersPinToVisibleBounds = true
|
||||
layout.sectionFootersPinToVisibleBounds = true
|
||||
listComp.layout = layout
|
||||
|
||||
listComp.reloadData()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user