TableView.ts 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826
  1. const { ccclass, property } = cc._decorator;
  2. enum Direction {
  3. vertical = 1,
  4. horizontal,
  5. }
  6. /** 动态加载的滚动列表
  7. * - 滑动列表动态加载
  8. * - 支持多种类型预制体混合滚动
  9. *
  10. * - item脚本需要有函数 setItemData 用于接收数据
  11. *
  12. * - 多个prefab混合时,要为每条item指定 pfbType
  13. *
  14. * - item、content锚点y需要为1其他为0.5
  15. * @author 薛鸿潇
  16. */
  17. @ccclass
  18. export default class TableView extends cc.Component {
  19. @property({ displayName: '预制条目', tooltip: '脚本必须实现 setItemData 方法用于接收数据!', type: [cc.Prefab] })
  20. private pre_item: cc.Prefab[] = [];
  21. @property({ displayName: '脚本名', tooltip: '脚本必须实现 setItemData 方法用于接收数据!', type: [cc.String] })
  22. private scr_item: string[] = [];
  23. /** 间距 */
  24. @property({ displayName: '间距' })
  25. private itemInterval: number = 0;
  26. @property({ displayName: '显示隐藏节点', tooltip: '一般是顶部标识可向下滑动的小图标', type: cc.Node })
  27. private node_xiabiao: cc.Node = null;
  28. @property({displayName: '上面的节点是否根据指定数据的长度来控制显示,优先级最高'})
  29. private isShowByLimitLength: boolean = false;
  30. @property({displayName: '长度值', visible(){return this.isShowByLimitLength}})
  31. private limitLength: number = 0;
  32. @property({ displayName: '滚动方向', tooltip: '', type: cc.Enum(Direction) })
  33. private direction = Direction.vertical;
  34. @property({displayName: "初始化时所有子节点隐藏"})
  35. private isHideAllChild: boolean = false;
  36. /** 数据 */
  37. private itemData: any = null;
  38. /** 滚动列表组件 */
  39. private scrollView: cc.ScrollView = null;
  40. /** item预制体组 */
  41. private item: Array<any> = null;
  42. /** 滑动列表的内容节点 */
  43. private content: cc.Node = null;
  44. /** 列表高 */
  45. private layerHeight: any = null;
  46. /** 列表宽 */
  47. private layerWith: any = null;
  48. /** ? */
  49. private firstItemIndex: number = 0;
  50. private lastItemIndex: number = 0;
  51. private firstItemData: any = {};
  52. private lastItemData: any = {};
  53. private itemArr: Array<any> = [];
  54. private itemNode: Array<any> = [];
  55. private itemPosMap: any = new Map();
  56. private initItemData: boolean = true;
  57. private count: number = 0;
  58. private itemCanMoveDown: boolean = null;
  59. private itemCanMoveUp: boolean = null;
  60. onLoad() {
  61. this.initPro();
  62. if (this.direction == Direction.vertical) {
  63. this.scrollView.vertical = true;
  64. this.scrollView.horizontal = false;
  65. }
  66. else {
  67. this.scrollView.vertical = false;
  68. this.scrollView.horizontal = true;
  69. }
  70. if(this.node_xiabiao)
  71. this.node_xiabiao.active = false;
  72. // 测试
  73. // let itemData = [];
  74. // for (let i = 0; i < 20; i++) {
  75. // let test_data = {
  76. // pfbType: 0,
  77. // }
  78. // itemData.push(test_data);
  79. // }
  80. // this.init(itemData);
  81. }
  82. private initPro() {
  83. this.scrollView = this.node.getComponent(cc.ScrollView);
  84. this.content = this.scrollView.content;
  85. this.item = this.pre_item;
  86. this.layerHeight = this.node.height;
  87. this.layerWith = this.node.width;
  88. for (let i = 0; i < this.item.length; i++) {
  89. this.itemNode[i] = cc.instantiate(this.item[i]);
  90. }
  91. this.node.on('srollview-init', this.init, this);
  92. this.node.on('srollview-update', this.updateList, this);
  93. }
  94. /**
  95. * @param itemData 列表数据
  96. * @param isSkipInit 跳过初始化
  97. * @returns
  98. */
  99. public init(itemData: Array<any>, isSkipInit: boolean = false) {
  100. if (!itemData[0]) {
  101. return false;
  102. }
  103. this.clearItem();
  104. this.itemData = itemData; //item数据
  105. this.firstItemIndex = 0;
  106. this.lastItemIndex = 0;
  107. this.firstItemData = {};
  108. this.lastItemData = {};
  109. this.itemArr = [];
  110. this.itemPosMap = new Map();
  111. this.initItemData = true;
  112. this.count = 0;
  113. if (isSkipInit) return;
  114. // this.itemNode = [];
  115. // for (let i = 0; i < this.item.length; i++) {
  116. // this.itemNode[i] = cc.instantiate(this.item[i]);
  117. // }
  118. // cc.log(this.testTime(0));// 消耗计时
  119. this.initItem();
  120. this.initItemPos(0);
  121. if(this.isHideAllChild) this.isHideAllChild = false;
  122. this.scrollView.node.on('scrolling', this.callback, this);
  123. // cc.log('tableView结束:' + this.testTime());
  124. }
  125. /**
  126. * 刷新列表
  127. * - 仅支持使用1种预制体时,更新data数据
  128. * @param itemData
  129. */
  130. public updateList(itemData: Array<any>) {
  131. this.itemData = itemData;
  132. const old_count = this.itemArr.length;
  133. for (let i = 0; i < old_count; i++) {
  134. if (this.itemData[i]) {
  135. if (this.direction == Direction.vertical) {
  136. if (!this.itemArr[i]) {
  137. let y = 0;
  138. if (i > 0) {
  139. y = this.itemArr[i - 1].y - this.itemArr[i - 1].height - this.itemInterval;// 下一条目纵坐标
  140. }
  141. let item_node = this.addItemNode(i, y);
  142. this.updateContentHeigh(this.itemArr[i].height - item_node.y);
  143. }
  144. }
  145. else {
  146. if (!this.itemArr[i]) {
  147. let x = 0;
  148. if (i > 0) {
  149. x = this.itemArr[i - 1].x + this.itemArr[i - 1].width + this.itemInterval;// 下一条目纵坐标
  150. }
  151. let item_node = this.addItemNode(i, x);
  152. this.updateContentHeigh(this.itemArr[i].width + item_node.x);
  153. }
  154. }
  155. let comp_script = this.itemArr[i].getComponent(this.scr_item[this.itemData[i].pfbType || 0]);
  156. comp_script && comp_script.setItemData(this.itemData[i], this);
  157. } else {
  158. this.itemArr[i].destroy();
  159. this.itemArr[i] = null;
  160. }
  161. }
  162. }
  163. update(dt) {
  164. if (!this.node_xiabiao)
  165. return;
  166. if(this.isShowByLimitLength)
  167. {
  168. if(this.itemData && this.itemData.length <= this.limitLength)
  169. {
  170. return;
  171. }
  172. }
  173. if (this.content.height > this.layerHeight) {
  174. if (this.scrollView.getScrollOffset().y >= this.scrollView.getMaxScrollOffset().y) {
  175. if (this.node_xiabiao.active == true)
  176. this.node_xiabiao.active = false;
  177. } else {
  178. if (this.node_xiabiao.active == false)
  179. this.node_xiabiao.active = true;
  180. }
  181. } else {
  182. if (this.node_xiabiao.active == true)
  183. this.node_xiabiao.active = false;
  184. }
  185. }
  186. private initItemPos(index: number) {
  187. let item_data_count = this.itemData.length;
  188. if (this.direction == Direction.vertical) {
  189. for (let i = index; i < item_data_count; i++) {
  190. let obj: any = {}
  191. if (i === 0) {
  192. obj.startPos = 0;
  193. } else {
  194. obj.startPos = this.itemPosMap.get(i - 1).endPos;
  195. }
  196. let j = this.itemData[i].pfbType || 0;
  197. obj.endPos = obj.startPos + this.itemNode[j].height + this.itemInterval;
  198. this.itemPosMap.set(i, obj);
  199. }
  200. }
  201. else {
  202. for (let i = index; i < item_data_count; i++) {
  203. let obj: any = {}
  204. if (i === 0) {
  205. obj.startPos = 0;
  206. } else {
  207. obj.startPos = this.itemPosMap.get(i - 1).endPos;
  208. }
  209. let j = this.itemData[i].pfbType || 0;
  210. obj.endPos = obj.startPos + this.itemNode[j].width + this.itemInterval;
  211. this.itemPosMap.set(i, obj);
  212. }
  213. }
  214. if (item_data_count > 0) {
  215. if (this.direction == Direction.vertical) {
  216. this.updateContentHeigh(this.itemPosMap.get(item_data_count - 1).endPos);
  217. }
  218. else {
  219. this.updateContentWidth(this.itemPosMap.get(item_data_count - 1).endPos);
  220. }
  221. }
  222. }
  223. /**
  224. * 实例化所有用到的item,控制实例化item的数目,暂定超出两个
  225. */
  226. private initItem() {
  227. let j = 0;
  228. if (this.direction == Direction.vertical) {
  229. for (let i = 0; i < this.itemData.length; i++) {
  230. if (this.content.height > this.layerHeight) {
  231. j++
  232. if (j > 2) {
  233. break;
  234. }
  235. }
  236. let y = 0;
  237. if (i > 0) {
  238. y = this.itemArr[i - 1].y - this.itemArr[i - 1].height - this.itemInterval;// 下一条目纵坐标
  239. }
  240. let item_node = this.addItemNode(i, y);
  241. this.updateContentHeigh(this.itemArr[i].height - item_node.y);
  242. }
  243. }
  244. else {
  245. for (let i = 0; i < this.itemData.length; i++) {
  246. if (this.content.width > this.layerWith) {
  247. j++
  248. if (j > 2) {
  249. break;
  250. }
  251. }
  252. let x = 0;
  253. if (i > 0) {
  254. x = this.itemArr[i - 1].x + this.itemArr[i - 1].width + this.itemInterval;// 下一条目纵坐标
  255. }
  256. let item_node = this.addItemNode(i, x);
  257. this.updateContentWidth(this.itemArr[i].width + item_node.x);
  258. }
  259. }
  260. }
  261. /**
  262. * 添加条目节点
  263. * @param i 编号
  264. * @param y 坐标y
  265. */
  266. private addItemNode(i: number, xOrY: number) {
  267. let pfbType = this.itemData[i].pfbType || 0;
  268. let item = cc.instantiate(this.itemNode[pfbType]);
  269. item.parent = this.content;
  270. item.pfbType = pfbType;
  271. item.index = i;
  272. if(this.isHideAllChild)
  273. item.active = false;
  274. if (this.direction == Direction.vertical) {
  275. if (i === 0) {
  276. item.y = 0;
  277. } else {
  278. item.y = xOrY;
  279. }
  280. item.x = 0;
  281. }
  282. else {
  283. if (i === 0) {
  284. item.x = 0;
  285. } else {
  286. item.x = xOrY;
  287. }
  288. item.y = 0;
  289. }
  290. //对item赋值
  291. let comp_script = item.getComponent(this.scr_item[pfbType]);
  292. comp_script && comp_script.setItemData(this.itemData[i], this);
  293. this.itemArr.push(item);
  294. return item;
  295. // cc.log('生成itemNode' + i);
  296. }
  297. /**
  298. * 更新centent高
  299. * @param num
  300. */
  301. private updateContentHeigh(num: number) {
  302. this.content.height = num > this.layerHeight ? num : this.layerHeight;
  303. // cc.log('滚动条高度:', this.content.height);
  304. }
  305. /**
  306. * 更新centent宽
  307. * @param num
  308. */
  309. private updateContentWidth(num: number) {
  310. this.content.width = num > this.layerWith ? num : this.layerWith;
  311. // cc.log('滚动条高度:', this.content.height);
  312. }
  313. /**
  314. * 触摸滚动条的函数回调
  315. * @param event
  316. * @param eventType
  317. * @returns
  318. */
  319. private callback(event, eventType) {
  320. // cc.log(event && event.type || eventType)
  321. if (this.direction == Direction.vertical) {
  322. if (this.content.height > this.layerHeight) {
  323. let firstItemPos = this.scrollView.getScrollOffset().y;
  324. let lastItemPos = firstItemPos + this.layerHeight;
  325. if (firstItemPos < 0) return;
  326. if (this.initItemData) {
  327. // cc.log('111:%o', this.itemPosMap)
  328. this.initItemData = false;
  329. this.updateFirstItemIndex();
  330. this.itemCanMoveDown = true;
  331. this.updateLastItemIndex();
  332. this.itemCanMoveDown = false;
  333. }
  334. //超出边界直接返回.
  335. //滚动条向上滑动可能会触发的函数
  336. if (firstItemPos > this.firstItemData.endPos) {
  337. if (this.lastItemIndex + 1 < this.itemData.length) {
  338. this.updateFirstItemIndex();
  339. }
  340. this.count++;
  341. }
  342. if (lastItemPos > this.lastItemData.endPos) {
  343. if (this.lastItemIndex + 1 < this.itemData.length) {
  344. this.itemCanMoveDown = true;
  345. this.updateLastItemIndex();
  346. this.itemCanMoveDown = false;
  347. }
  348. }
  349. //滚动条向下滑动可能会触发的函数
  350. if (lastItemPos < this.lastItemData.startPos) {
  351. this.updateLastItemIndex();
  352. this.count--;
  353. }
  354. if (firstItemPos < this.firstItemData.startPos) {
  355. this.itemCanMoveUp = true;
  356. this.updateFirstItemIndex();
  357. this.itemCanMoveUp = false;
  358. }
  359. }
  360. }
  361. else {
  362. if (this.content.width > this.layerWith) {
  363. let firstItemPos = -this.scrollView.getScrollOffset().x;
  364. let lastItemPos = firstItemPos + this.layerWith;
  365. if (firstItemPos < 0) return;
  366. if (this.initItemData) {
  367. // cc.log('111:%o', this.itemPosMap)
  368. this.initItemData = false;
  369. this.updateFirstItemIndex();
  370. this.itemCanMoveDown = true;
  371. this.updateLastItemIndex();
  372. this.itemCanMoveDown = false;
  373. }
  374. //超出边界直接返回.
  375. //滚动条向上滑动可能会触发的函数
  376. if (firstItemPos > this.firstItemData.endPos) {
  377. if (this.lastItemIndex + 1 < this.itemData.length) {
  378. this.updateFirstItemIndex();
  379. }
  380. this.count++;
  381. }
  382. if (lastItemPos > this.lastItemData.endPos) {
  383. if (this.lastItemIndex + 1 < this.itemData.length) {
  384. this.itemCanMoveDown = true;
  385. this.updateLastItemIndex();
  386. this.itemCanMoveDown = false;
  387. }
  388. }
  389. //滚动条向下滑动可能会触发的函数
  390. if (lastItemPos < this.lastItemData.startPos) {
  391. this.updateLastItemIndex();
  392. this.count--;
  393. }
  394. if (firstItemPos < this.firstItemData.startPos) {
  395. this.itemCanMoveUp = true;
  396. this.updateFirstItemIndex();
  397. this.itemCanMoveUp = false;
  398. }
  399. }
  400. }
  401. }
  402. private updateFirstItemIndex() {
  403. let num = this.firstItemIndex;
  404. if (this.itemCanMoveUp && num > this.getItemIndex()[0] && num > 0) {
  405. this.itemMoveUp(this.firstItemIndex - 1);
  406. }
  407. this.updateItemIndex();
  408. }
  409. private updateLastItemIndex() {
  410. let num = this.lastItemIndex;
  411. if (this.itemCanMoveDown && num < this.getItemIndex()[1] && num + 1 < this.itemData.length) {
  412. this.itemMoveDown(this.lastItemIndex + 1);
  413. }
  414. this.updateItemIndex();
  415. }
  416. private updateItemIndex() {
  417. //cc.log(this.firstItemIndex, this.lastItemIndex, this.itemArr, this.itemData)
  418. }
  419. /**
  420. * 得到滚动条此时状态下应有的itemNode元素,包括滚动条上方一个,滚动条下方一个
  421. * @returns
  422. */
  423. private getItemIndex() {
  424. let arr = [];
  425. if (this.direction == Direction.vertical) {
  426. let firstItemPos = this.scrollView.getScrollOffset().y;
  427. let lastItemPos = firstItemPos + this.layerHeight;
  428. console.log('firstItemPos 22 ', firstItemPos)
  429. console.log('lastItemPos 22 ', lastItemPos)
  430. this.itemPosMap.forEach((value, key) => {
  431. let status1 = value.startPos <= firstItemPos && value.endPos > firstItemPos;
  432. let status2 = value.startPos >= firstItemPos && value.endPos < lastItemPos;
  433. let status3 = value.startPos <= lastItemPos && value.endPos > lastItemPos;
  434. if (status1) {
  435. this.firstItemData.startPos = value.startPos;
  436. this.firstItemData.endPos = value.endPos;
  437. this.firstItemIndex = key;
  438. arr.push(key);
  439. }
  440. if (status3) {
  441. this.lastItemData.startPos = value.startPos;
  442. this.lastItemData.endPos = value.endPos;
  443. this.lastItemIndex = key;
  444. arr.push(key);
  445. }
  446. })
  447. }
  448. else {
  449. let firstItemPos = -this.scrollView.getScrollOffset().x;
  450. let lastItemPos = firstItemPos + this.layerWith;
  451. console.log('firstItemPos ', firstItemPos)
  452. console.log('lastItemPos ', lastItemPos)
  453. this.itemPosMap.forEach((value, key) => {
  454. let status1 = value.startPos <= firstItemPos && value.endPos > firstItemPos;
  455. let status2 = value.startPos >= firstItemPos && value.endPos < lastItemPos;
  456. let status3 = value.startPos <= lastItemPos && value.endPos > lastItemPos;
  457. if (status1) {
  458. this.firstItemData.startPos = value.startPos;
  459. this.firstItemData.endPos = value.endPos;
  460. this.firstItemIndex = key;
  461. arr.push(key);
  462. }
  463. if (status3) {
  464. this.lastItemData.startPos = value.startPos;
  465. this.lastItemData.endPos = value.endPos;
  466. this.lastItemIndex = key;
  467. arr.push(key);
  468. }
  469. })
  470. }
  471. console.log('arr >>>>> ', arr)
  472. return arr;
  473. }
  474. /**
  475. * 滚动到顶部【滚动条顺序是从上到下开始遍历】
  476. * @param num
  477. * @returns
  478. */
  479. private itemMoveUp(num: number) {
  480. if (num < 0 || this.lastItemIndex + 1 < num || num + 1 > this.itemData.length) {
  481. return;
  482. }
  483. if (!this.hasItem(num)) {
  484. if (this.direction == Direction.vertical) {
  485. this.itemMove(num, -this.itemPosMap.get(num).startPos);
  486. }
  487. else {
  488. this.itemMove(num, this.itemPosMap.get(num).startPos);
  489. }
  490. }
  491. num++;
  492. return this.itemMoveUp(num);
  493. }
  494. /** 滚动到底部 */
  495. public itemMoveDown(num: number) {
  496. if (num < 0 || this.firstItemIndex - 1 > num || num + 1 > this.itemData.length) {
  497. return;
  498. }
  499. if (!this.hasItem(num)) {
  500. if (this.direction == Direction.vertical) {
  501. this.itemMove(num, -this.itemPosMap.get(num).startPos);
  502. }
  503. else {
  504. this.itemMove(num, this.itemPosMap.get(num).startPos);
  505. }
  506. }
  507. num--;
  508. return this.itemMoveDown(num);
  509. }
  510. /**
  511. * 判断指定index位置是否存在itemNode
  512. * @param index 节点下标
  513. * @returns
  514. */
  515. private hasItem(index: number) {
  516. for (let i = 0; i < this.itemArr.length; i++) {
  517. if (this.itemArr[i].index === index) {
  518. return true;
  519. }
  520. }
  521. return false;
  522. }
  523. /**
  524. * 移动条目
  525. * 逻辑判断,第一种情况,修改itemArr数组的某个对象,第二种情况实例化一个新itemNode
  526. * @param index 条目节点标记
  527. * @param y
  528. * @returns
  529. */
  530. private itemMove(index: number, xOrY: number) {
  531. for (let i = 0; i < this.itemArr.length; i++) {
  532. //index存在-1的情况,类似于在缓存池里的item.
  533. let status1 = this.itemArr[i].index < this.firstItemIndex - 1 ? true : false;
  534. let status2 = this.itemArr[i].index > this.lastItemIndex + 1 ? true : false;
  535. let status3 = this.itemArr[i].pfbType === (this.itemData[index].pfbType || 0);
  536. //cc.log('item的索引', this.firstItemIndex, this.lastItemIndex)
  537. if (status1 && status3 || status2 && status3) {
  538. //cc.log(i, index, this.itemArr, this.content.height);
  539. //给item赋值还有设置位置
  540. this.itemArr[i].index = index;
  541. if (this.direction == Direction.vertical) {
  542. this.itemArr[i].y = xOrY;
  543. }
  544. else {
  545. this.itemArr[i].x = xOrY;
  546. }
  547. let comp_script = this.itemArr[i].getComponent(this.scr_item[this.itemArr[i].pfbType]);
  548. comp_script && comp_script.setItemData(this.itemData[index], this);
  549. return;
  550. }
  551. }
  552. this.addItemNode(index, xOrY);
  553. }
  554. /**
  555. * 内容滚动到指定下标位置
  556. * @param index 条目index
  557. */
  558. public contentMoveByIndex(index: number, duration: number = 0.5) {
  559. let pos_xOrY = this.itemPosMap.get(index).startPos;
  560. if (this.direction == Direction.vertical) {
  561. this.scrollView.scrollToOffset(new cc.Vec2(this.content.x, pos_xOrY), duration);
  562. }
  563. else {
  564. this.scrollView.scrollToOffset(new cc.Vec2(pos_xOrY, this.content.y), duration);
  565. }
  566. }
  567. public getItemByIndexAndCount(index: number, count: number)
  568. {
  569. const itemArray: Array<any> = [];
  570. for(let j = 0; j != this.itemArr.length; ++j)
  571. {
  572. let isCheckSuccess = false;
  573. for(let i = index; i != (index + count); ++i){
  574. if(this.itemArr[j].index == i)
  575. {
  576. itemArray.push(this.itemArr[j]);
  577. isCheckSuccess = true;
  578. break;
  579. }
  580. if(!isCheckSuccess)
  581. {
  582. this.itemArr[j].active = true;
  583. }
  584. }
  585. }
  586. return itemArray;
  587. }
  588. public getFrontPositionItemByCount(count: number)
  589. {
  590. const itemArray: Array<any> = [];
  591. for(let i = 0; i != this.itemArr.length; ++i)
  592. {
  593. if(i < count)
  594. {
  595. itemArray.push(this.itemArr[i]);
  596. }else
  597. {
  598. this.itemArr[i].active = true;
  599. }
  600. }
  601. return itemArray;
  602. }
  603. /**
  604. * 得到相关位置的排序index
  605. * 方法待验证,可能有问题
  606. * @param pos 坐标
  607. * @returns
  608. */
  609. public getPosIndex(pos: cc.Vec2) {
  610. for (let [key, value] of this.itemPosMap.entries()) {
  611. if (value.endPos > pos && value.startPos <= pos) {
  612. return key;
  613. }
  614. }
  615. }
  616. /**
  617. * 添加条目
  618. * @param obj 数据对象
  619. * @returns
  620. */
  621. public addItem(obj: any) {
  622. this.itemData.push(obj);
  623. this.initItemPos(this.itemData.length - 1);
  624. let endPos = this.itemPosMap.get(this.itemData.length - 1).endPos;
  625. let layerHOrW = 0;
  626. if (this.direction == Direction.vertical) {
  627. layerHOrW = this.layerHeight;
  628. }
  629. else {
  630. layerHOrW = this.layerWith;
  631. }
  632. if (endPos - layerHOrW > 0) {
  633. let startPos = endPos - layerHOrW;
  634. //得到当前的firstItemIndex;
  635. for (let i = this.itemData.length - 1; i >= 0; i--) {
  636. if (this.itemPosMap.get(i).endPos > startPos && this.itemPosMap.get(i).startPos <= startPos) {
  637. this.firstItemIndex = i;
  638. }
  639. }
  640. if (this.direction == Direction.vertical) {
  641. this.scrollView.scrollToBottom();
  642. }
  643. else {
  644. this.scrollView.scrollToRight();
  645. }
  646. this.lastItemIndex = this.itemData.length - 1;
  647. let num = this.firstItemIndex - 1 > 0 ? (this.firstItemIndex - 1) : 0;
  648. this.itemMoveUp(num);
  649. return true;
  650. } else {
  651. this.firstItemIndex = 0;
  652. this.lastItemIndex = this.itemData.length - 1;
  653. this.itemMoveUp(this.firstItemIndex);
  654. return false;
  655. }
  656. }
  657. /**
  658. * 清理条目
  659. */
  660. public clearItem() {
  661. this.itemData = [];
  662. this.itemPosMap.clear();
  663. this.scrollView.scrollToTop();
  664. this.content.height = 0;
  665. for (let i in this.itemArr) {
  666. // this.itemArr[i].index = -1;
  667. // this.itemArr[i].y = 3000;
  668. this.itemArr[i].destroy();
  669. }
  670. }
  671. /**
  672. * 删除指定条目
  673. * @param i 节点.index
  674. * @returns
  675. */
  676. public deleteItem(i: number) {
  677. this.itemData.splice(i, 1);
  678. const item_data_count = this.itemData.length;
  679. if (item_data_count <= 0) return;
  680. this.initItemPos(item_data_count - 1);
  681. //改变this.itemArr的内容
  682. for (let j = 0; j < this.itemArr.length; j++) {
  683. if (this.direction == Direction.vertical) {
  684. if (this.itemArr[j].index === i) {
  685. this.itemArr[j].index = -1;
  686. this.itemArr[j].y = 3000;
  687. }
  688. if (this.itemArr[j].index > i) {
  689. let num = this.itemArr[j].index;
  690. this.itemArr[j].y = -this.itemPosMap.get(num - 1).startPos;
  691. this.itemArr[j].index = num - 1;
  692. }
  693. }
  694. else {
  695. if (this.itemArr[j].index === i) {
  696. this.itemArr[j].index = -1;
  697. this.itemArr[j].x = 3000;
  698. }
  699. if (this.itemArr[j].index > i) {
  700. let num = this.itemArr[j].index;
  701. this.itemArr[j].x = this.itemPosMap.get(num - 1).startPos;
  702. this.itemArr[j].index = num - 1;
  703. }
  704. }
  705. }
  706. this.updateContentHeigh(this.itemPosMap.get(this.itemData.length - 1).endPos);
  707. if (!this.lastItemIndex) this.getItemIndex();// 初始化时没有初始化此值,会导致为0.不能创建新的item,此处校验
  708. this.itemMoveUp(this.firstItemIndex);//
  709. }
  710. /**
  711. * 重置指定item
  712. * @param index 节点下标
  713. * @param item_data 新的数据
  714. */
  715. public resetItemData(index: number, item_data?: any) {
  716. for (let i = 0; i < this.itemArr.length; i++) {
  717. if (this.itemArr[i].index === index) {
  718. if (item_data) this.itemData[i] = item_data;
  719. let comp_script = this.itemArr[i].getComponent(this.scr_item[this.itemArr[i].pfbType]);
  720. comp_script && comp_script.setItemData(this.itemData[index], this);
  721. break;
  722. }
  723. }
  724. }
  725. private lastResetItemInfoHeight: any = null;
  726. private lastResetItemIndex: any = null;
  727. /**
  728. * 重置条目大小
  729. * @param index 节点下标
  730. * @param infoHeight 新的高度
  731. */
  732. public resetItemSize(index: number, infoHeight: number) {
  733. let func = (function (index, infoHeight) {
  734. for (let i = 0; i < this.itemArr.length; i++) {
  735. if (this.itemArr[i].index > index) {
  736. if (this.direction == Direction.vertical) {
  737. this.itemArr[i].y -= infoHeight;
  738. }
  739. else {
  740. this.itemArr[i].x += infoHeight;
  741. }
  742. }
  743. }
  744. for (let [key, value] of this.itemPosMap.entries()) {
  745. if (key === index) {
  746. value.endPos += infoHeight;
  747. }
  748. if (key > index) {
  749. value.endPos += infoHeight;
  750. value.startPos += infoHeight;
  751. }
  752. }
  753. this.lastResetItemInfoHeight = infoHeight;
  754. this.lastResetItemIndex = index;
  755. }).bind(this);
  756. if (this.lastResetItemIndex !== null && this.lastResetItemInfoHeight) {
  757. if (this.lastResetItemIndex === index) {
  758. func(this.lastResetItemIndex, -this.lastResetItemInfoHeight);
  759. this.lastResetItemIndex = null;
  760. this.lastResetItemInfoHeight = 0;
  761. } else {
  762. func(this.lastResetItemIndex, -this.lastResetItemInfoHeight);
  763. func(index, infoHeight);
  764. }
  765. } else {
  766. func(index, infoHeight);
  767. }
  768. this.itemMoveUp(this.firstItemIndex);
  769. this.updateContentHeigh(this.itemPosMap.get(this.itemData.length - 1).endPos);
  770. }
  771. }