Laya List翻页滚动方案 & List滚动源码解析
@author ixenos 2019-03-29
1.List翻页滚动方案
1 /**
2 * 计算下一页的起始索引, 不足时补足
3 * @param direction 0 for pre, 1 for nex ， @author ixenos 2019-03-29
4 */
5 private function btnScrollControl(direction:int=0):void{
6 if(direction==0){
7 var minusResult:int = list.startIndex - list.repeatX;
8 if(minusResult>=0){
9 list.tweenTo(minusResult);
10 }else{
11 list.tweenTo(0);
12 }
13 }else if(direction==1){
14 var plusResult:int = list.startindex + list.repeatX;
15 if(plusResult<=list.array.length-1){
16 list.tweenTo(plusResult);
17 }else{
18 list.tweenTo(list.array.length-1);
19 }}
20 }
2.List滚动源码解析
1) scrollTo和tweenTo都需要list本身自带滚动条
1 /**
2 * <p>滚动列表，以设定的数据索引对应的单元格为当前可视列表的第一项。</p>
3 * @param index 单元格在数据列表中的索引。
4 */
5 public function scrollTo(index:int):void {
6 if (_scrollBar) {
7 var numX:int = _isVertical ? repeatX : repeatY;
8 _scrollBar.value = Math.floor(index / numX) * _cellSize;
9 } else {
10 startIndex = index;
11 }
12 }
2) tweenTo内部是对scrollBar进行tween
1 /**
2 * <p>缓动滚动列表，以设定的数据索引对应的单元格为当前可视列表的第一项。</p>
3 * @param index 单元格在数据列表中的索引。
4 * @param time 缓动时间。
5 * @param complete 缓动结束回掉
6 */
7 public function tweenTo(index:int, time:int = 200, complete:Handler = null):void {
8 if (_scrollBar) {
9 var numX:int = _isVertical ? repeatX : repeatY;
10 Tween.to(_scrollBar, {value: Math.floor(index / numX) * _cellSize}, time, null, complete, 0, true);
11 } else {
12 startIndex = index;
13 if (complete) complete.run();
14 }
15 }
3) scrollBar之于List
1 public function set scrollBar(value:ScrollBar):void {
2 if (_scrollBar != value) {
3 _scrollBar = value;
4 if (value) {
5 _isVertical = _scrollBar.isVertical;
6 addChild(_scrollBar);
7 _scrollBar.on(Event.CHANGE, this, onScrollBarChange);
8 }
9 }
10 }
1 /**
2 * @private
3 * 滚动条的 <code>Event.CHANGE</code> 事件侦听处理函数。
4 */
5 protected function onScrollBarChange(e:Event = null):void {
6 runCallLater(changeCells);
7 var scrollValue:Number = _scrollBar.value;
8 var lineX:int = (_isVertical ? this.repeatX : this.repeatY);
9 var lineY:int = (_isVertical ? this.repeatY : this.repeatX);
10 var scrollLine:int = Math.floor(scrollValue / _cellSize);
11
12 if (!cacheContent) {
13 var index:int = scrollLine * lineX;
14 var num:int = 0;
15 if (index > _startIndex) {
16 num = index - _startIndex;
17 var down:Boolean = true;
18 var toIndex:int = _startIndex + lineX * (lineY + 1);
19 _isMoved = true;
20 } else if (index < _startIndex) {
21 num = _startIndex - index;
22 down = false;
23 toIndex = _startIndex - 1;
24 _isMoved = true;
25 }
26
27 for (var i:int = 0; i < num; i++) {
28 if (down) {
29 var cell:Box = _cells.shift();
30 _cells[_cells.length] = cell;
31 var cellIndex:int = toIndex + i;
32 } else {
33 cell = _cells.pop();
34 _cells.unshift(cell);
35 cellIndex = toIndex - i;
36 }
37 var pos:Number = Math.floor(cellIndex / lineX) * _cellSize;
38 _isVertical ? cell.y = pos : cell.x = pos;
39 renderItem(cell, cellIndex);
40 }
41 _startIndex = index;
42 changeSelectStatus();
43 } else {
44 num = (lineY + 1);
45 if (_createdLine - scrollLine < num) {
46 _createItems(_createdLine, lineX, _createdLine + num);
47 renderItems(_createdLine * lineX, 0);
48 _createdLine += num;
49 }
50 }
51
52 var r:Rectangle = _content._style.scrollRect;
53 if (_isVertical) {
54 r.y = scrollValue - _offset.y;
55 r.x = -_offset.x;
56 } else {
57 r.y = -_offset.y;
58 r.x = scrollValue - _offset.x;
59 }
60 _content.scrollRect = r;
61 }
