"use strict"; cc._RF.push(module, '2347dWJuLJASYBP/2yD3H1b', 'SuperScrollView'); // Script/view/SuperScrollview/SuperScrollView.ts "use strict"; var __extends = (this && this.__extends) || (function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; return c > 3 && r && Object.defineProperty(target, key, r), r; }; var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } return new (P || (P = Promise))(function (resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); }; var __generator = (this && this.__generator) || function (thisArg, body) { var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; function verb(n) { return function (v) { return step([n, v]); }; } function step(op) { if (f) throw new TypeError("Generator is already executing."); while (_) try { if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; if (y = 0, t) op = [op[0] & 2, t.value]; switch (op[0]) { case 0: case 1: t = op; break; case 4: _.label++; return { value: op[1], done: false }; case 5: _.label++; y = op[1]; op = [0]; continue; case 7: op = _.ops.pop(); _.trys.pop(); continue; default: if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } if (t[2]) _.ops.pop(); _.trys.pop(); continue; } op = body.call(thisArg, _); } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; } }; Object.defineProperty(exports, "__esModule", { value: true }); var SuperListItem_1 = require("./SuperListItem"); var _a = cc._decorator, ccclass = _a.ccclass, property = _a.property; var SuperScrollView = /** @class */ (function (_super) { __extends(SuperScrollView, _super); function SuperScrollView() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.pfItemTemplate = null; _this.itemSize = null; _this.itemNodePool = null; _this.duration = 1; // @property({ // tooltip: '最多可以显示多少个Item', // }) _this.visibleNum = 12; _this.curIndex = 0; _this.itemInfoList = []; _this.isFrameLoading = false; _this.isLoadingFinished = true; _this.cbAfterSetData = null; _this.lastTime = 0; return _this; // update (dt) {} } SuperScrollView.prototype.onLoad = function () { this.elastic = true; this.content.on(cc.Node.EventType.CHILD_ADDED, this.childAdded.bind(this)); this.node.on("touchend", this.onTouchEnd, this); this.node.on("scroll-ended", this.onScrollEnded, this); this.node.on("scrolling", this.onScrolling, this); this.node.on("bounce-top", this.onBounceTop, this); this.node.on("bounce-bottom", this.onBounceBottom, this); this.node.on("bounce-left", this.onBounceLeft, this); this.node.on("bounce-right", this.onBounceRight, this); this.initNodePool(); }; SuperScrollView.prototype.onDestroy = function () { this.content.off(cc.Node.EventType.CHILD_ADDED, this.childAdded); this.node.off("touchend", this.onTouchEnd, this); this.node.off("scroll-ended-with-threshold", this.onScrollEnded, this); this.node.off("scrolling", this.onScrolling, this); this.node.off("bounce-top", this.onBounceTop, this); this.node.off("bounce-bottom", this.onBounceBottom, this); this.node.off("bounce-left", this.onBounceLeft, this); this.node.off("bounce-right", this.onBounceRight, this); }; SuperScrollView.prototype.initNodePool = function () { var itemNode = cc.instantiate(this.pfItemTemplate); var contentSize = itemNode.getContentSize(); this.itemSize = contentSize; var parentSize = this.content.parent.getContentSize(); var layoutComp = this.content.getComponent(cc.Layout); var num = 0; if (layoutComp) { if (layoutComp.type === cc.Layout.Type.VERTICAL && this.vertical && !this.horizontal) { num = Math.ceil(parentSize.height / contentSize.height); } else if (layoutComp.type === cc.Layout.Type.HORIZONTAL && this.horizontal && this.vertical) { num = Math.ceil(parentSize.width / contentSize.width); } else if (layoutComp.type === cc.Layout.Type.GRID) { var rowEleCount = Math.floor((parentSize.width - layoutComp.paddingLeft - layoutComp.paddingRight + layoutComp.spacingX) / (contentSize.width + layoutComp.spacingX)); var colEleCount = Math.floor((parentSize.height - layoutComp.paddingTop - layoutComp.paddingBottom + layoutComp.spacingY) / (contentSize.height + layoutComp.spacingY)); num = rowEleCount * colEleCount; // console.log('最多显示个数:GRID', rowEleCount, colEleCount); } } this.visibleNum = Math.floor(num * 2) + 2; // console.log('最多显示个数', this.visibleNum); if (this.itemNodePool) { //清空 this.itemNodePool.clear(); } else { this.itemNodePool = new cc.NodePool(); } //多放3个 for (var i = 0; i < this.visibleNum + 3; i++) { var itemNode_1 = cc.instantiate(this.pfItemTemplate); this.itemNodePool.put(itemNode_1); } }; //添加节点 SuperScrollView.prototype.childAdded = function (itemNode) { this.curIndex++; itemNode.name = "item" + this.curIndex; }; SuperScrollView.prototype.scrollToIndex = function (index, seconds) { if (seconds === void 0) { seconds = 0.2; } // cc.log("index:", index); var childCount = this.content.childrenCount; // cc.log("childCount:", childCount); if (index < 1) { // cc.log("index 过小"); index = 1; } else if (index > childCount) { // cc.log("index 过大"); index = childCount; } var item = this.content.getChildByName('item' + index); if (item) { var layoutComp = this.content.getComponent(cc.Layout); if (layoutComp) { if (layoutComp.type === cc.Layout.Type.VERTICAL && this.vertical && !this.horizontal) { this.scrollToPercentVertical((childCount - index) / childCount, seconds); } else if (layoutComp.type === cc.Layout.Type.HORIZONTAL && !this.vertical && this.horizontal) { this.scrollToPercentHorizontal((childCount - index) / childCount, seconds); } else if (layoutComp.type === cc.Layout.Type.GRID) { if (layoutComp.startAxis === cc.Layout.AxisDirection.HORIZONTAL) { var contentSize = this.content.getContentSize(); var itemContentSize = item.getContentSize(); // contentSize.width = layoutComp.paddingLeft + layoutComp.paddingRight + itemContentSize.width * n + layoutComp.spacingX *(n-1) var rowEleCount = Math.floor((contentSize.width - layoutComp.paddingLeft - layoutComp.paddingRight + layoutComp.spacingX) / (itemContentSize.width + layoutComp.spacingX)); // cc.log("每行多少个:", rowEleCount); var hang = Math.ceil(index / rowEleCount); var totalHang = Math.ceil(childCount / rowEleCount); this.scrollToPercentVertical((totalHang - hang) / totalHang, seconds); } else { var contentSize = this.content.getContentSize(); var itemContentSize = item.getContentSize(); var colEleCount = Math.floor((contentSize.height - layoutComp.paddingTop - layoutComp.paddingBottom + layoutComp.spacingY) / (itemContentSize.height + layoutComp.spacingY)); // cc.log("每列多少个:", colEleCount); var lie = Math.ceil(index / colEleCount); var totalLie = Math.ceil(childCount / colEleCount); this.scrollToPercentHorizontal((totalLie - lie) / totalLie, seconds); } } else { // cc.log("cc.Layout.Type不对"); } } } }; SuperScrollView.prototype.onTouchEnd = function () { return; this.improveDC(); }; SuperScrollView.prototype.onScrollEnded = function () { // cc.log("onScrollEnded"); this.improveDC(); }; SuperScrollView.prototype.onScrolling = function () { var now = Date.now(); if (now - this.lastTime < 200) { return; } // cc.log("scolling"); this.lastTime = now; var scrollOffset = this.getScrollOffset(); var offsetX = scrollOffset.x; var offsetY = scrollOffset.y; this.improveDC(); }; SuperScrollView.prototype.onBounceTop = function () { // cc.log("onBounceTop") }; SuperScrollView.prototype.onBounceBottom = function () { // cc.log("onBounceBottom") }; SuperScrollView.prototype.onBounceLeft = function () { // cc.log("onBounceLeft") }; SuperScrollView.prototype.onBounceRight = function () { // cc.log("onBounceLeft") }; SuperScrollView.prototype.newItemNode = function () { // let itemNode = this.itemNodePool.get(); // if (!itemNode) { // cc.log("instantiate"); // itemNode = cc.instantiate(this.pfItemTemplate); // } var itemNode = cc.instantiate(this.pfItemTemplate); return itemNode; }; // 优化DrawCall SuperScrollView.prototype.improveDC = function () { if (this.content.childrenCount == 0) { return; } var svLeftBottomPoint = this.node.parent.convertToWorldSpaceAR( // cc.v2(0,0) cc.v2(this.node.x - this.node.anchorX * this.node.width, this.node.y - this.node.anchorY * this.node.height)); // 求出 ScrollView 可视区域在世界坐标系中的矩形(碰撞盒) var svBBoxRect = cc.rect(svLeftBottomPoint.x, svLeftBottomPoint.y, this.node.width, this.node.height); // 遍历 ScrollView Content 内容节点的子节点,对每个子节点的包围盒做和 ScrollView 可视区域包围盒做碰撞判断 this.content.children.forEach(function (childNode) { // 如果相交了,那么就显示,否则就隐藏 var childNodeBBox = childNode.getBoundingBoxToWorld(); if (childNodeBBox.intersects(svBBoxRect)) { if (childNode.opacity === 0) { childNode.opacity = 255; } } else { if (childNode.opacity !== 0) { childNode.opacity = 0; } } }); }; SuperScrollView.prototype.setData = function (itemInfoList, isFrameLoading, cb) { if (isFrameLoading === void 0) { isFrameLoading = false; } return __awaiter(this, void 0, void 0, function () { var i, item; var _this = this; return __generator(this, function (_a) { switch (_a.label) { case 0: if (!this.isLoadingFinished) { return [2 /*return*/]; } this.curIndex = 0; this.isLoadingFinished = false; this.isFrameLoading = isFrameLoading; this.itemInfoList = itemInfoList; this.cbAfterSetData = cb; this.content.destroyAllChildren(); if (!this.isFrameLoading) return [3 /*break*/, 2]; return [4 /*yield*/, this.executePreFrame(this.getItemGenerator(this.itemInfoList.length), this.duration)]; case 1: _a.sent(); return [3 /*break*/, 3]; case 2: for (i = 0; i < this.itemInfoList.length; i++) { item = this.newItemNode(); item.parent = this.content; item.getComponent(SuperListItem_1.default).setData(itemInfoList[i]); } this.isLoadingFinished = true; this.scheduleOnce(function () { _this.cbAfterSetData && _this.cbAfterSetData(); _this.improveDC(); }); _a.label = 3; case 3: return [2 /*return*/]; } }); }); }; //@ts-ignore SuperScrollView.prototype.executePreFrame = function (generator, duration) { var _this = this; return new Promise(function (resolve, reject) { var gen = generator; // 创建执行函数 var execute = function () { // 执行之前,先记录开始时间 var startTime = new Date().getTime(); // 然后一直从 Generator 中获取已经拆分好的代码段出来执行 for (var iter = gen.next();; iter = gen.next()) { // 判断是否已经执行完所有 Generator 的小代码段,如果是的话,那么就表示任务完成 if (iter == null || iter.done) { //@ts-ignore resolve(); return; } // 每执行完一段小代码段,都检查一下是否已经超过我们分配的本帧,这些小代码端的最大可执行时间 if (new Date().getTime() - startTime > duration) { // 如果超过了,那么本帧就不在执行,开定时器,让下一帧再执行 _this.scheduleOnce(function () { execute(); }); return; } } }; // 运行执行函数 execute(); }); }; SuperScrollView.prototype.initItem = function (itemInfo) { var itemNode = this.newItemNode(); itemNode.parent = this.content; itemNode.getComponent(SuperListItem_1.default).setData(itemInfo); }; SuperScrollView.prototype.getItemGenerator = function (length) { var i; var _this = this; return __generator(this, function (_a) { switch (_a.label) { case 0: i = 0; _a.label = 1; case 1: if (!(i < length)) return [3 /*break*/, 4]; return [4 /*yield*/, this.initItem(this.itemInfoList[i])]; case 2: _a.sent(); _a.label = 3; case 3: i++; return [3 /*break*/, 1]; case 4: this.isLoadingFinished = true; this.scheduleOnce(function () { _this.cbAfterSetData && _this.cbAfterSetData(); _this.improveDC(); }); return [2 /*return*/]; } }); }; SuperScrollView.prototype.canInputData = function () { return this.isLoadingFinished; }; //通过index去获取节点 SuperScrollView.prototype.getItem = function (index) { var item = this.content.getChildByName('item' + index); return item || null; }; __decorate([ property({ type: cc.Node, tooltip: 'item模板', }) ], SuperScrollView.prototype, "pfItemTemplate", void 0); __decorate([ property({ tooltip: '分帧加载时间间隔', }) ], SuperScrollView.prototype, "duration", void 0); SuperScrollView = __decorate([ ccclass ], SuperScrollView); return SuperScrollView; }(cc.ScrollView)); exports.default = SuperScrollView; cc._RF.pop();