TableView.ts 31 KB

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