2.0.7的 PageView 拖动的页数比较多时，松手后会回到原来index的下一个位置

Creator 2.x
#1

我的pageview是这样的

image.png830×294 156 KB

当我拖动到下边的数字是4或者5或之后的item，松手后，会自动回到3，也就是拖动之前的item的下一个····
我看了下源码，
image.png887×126 6.31 KB

这个是只判断方向了，没有判断具体位置~所以永远会只滑到下一项或者上一项
还有滑动惯性也不起作用···
@jare @BigBear 请问大大，是pageview就这样的设计的么？？？
还是说我这个需求算是特殊的，要我自己来定制么

#2

目前来看，设计如此。
如果你觉得功能不够用，可以自行修改pageview组件相关功能代码。
组件是可定制的，只是提供了基础的功能。

#3

谢谢回复，已经自行更改了

#4

请问是怎样修改的呢？我这边需要做一个具有惯性滑动的pageView，一下子能够滑动多页的那种

#5

请问是怎样修改的呢？

#6

继承cc.PageView，自己扩展下吧
我贴下代码~需要的话，可以根据自己实际需求更改

`_getDragDirection(moveOffset)
{
if (this.direction === cc.PageView.Direction.Horizontal) {
let drag = 0;
let offsetX = Math.abs(moveOffset.x);
if (offsetX == 0) {
drag = 0;
} else if (offsetX <= 80) {
drag = 0;
} else {
drag = Math.ceil(offsetX / 370);
}
drag = moveOffset.x > 0 ? drag : -drag;
return drag;
}
else if (this.direction === cc.PageView.Direction.Vertical) {
// 由于滚动 Y 轴的原点在在右上角所以应该是小于 0
if (moveOffset.y === 0) { return 0; }
return (moveOffset.y < 0 ? 1 : -1);
}
}

_autoScrollToPage()
{
    let bounceBackStarted = this._startBounceBackIfNeeded();
    let moveOffset = this._touchBeganPosition.sub(this._touchEndPosition);
    if (bounceBackStarted) {
        let dragDirection = this._getDragDirection(moveOffset);
        if (dragDirection === 0) {
            return;
        }
        if (dragDirection > 0) {
            this._curPageIdx = this._pages.length - 1;
        }
        else {
            this._curPageIdx = 0;
        }
        if (this.indicator) {
            this.indicator._changedState();
        }
    }
    else {
        let index = this._curPageIdx;
        let nextIndex = index + this._getDragDirection(moveOffset);
        let timeInSecond = this.pageTurningSpeed * Math.abs(index - nextIndex);
        if (nextIndex < this._pages.length) {
            if (this._isScrollable(moveOffset, index, nextIndex)) {
                this.scrollToPage(nextIndex, timeInSecond);
                return;
            }
            else {
                let touchMoveVelocity = this._calculateTouchMoveVelocity();
                if (this._isQuicklyScrollable(touchMoveVelocity)) {
                    this.scrollToPage(nextIndex, timeInSecond);
                    return;
                }
            }
        } else {
            nextIndex = this._pages.length - 1;
            this.scrollToPage(nextIndex, timeInSecond);
            return;
        }

        this.scrollToPage(index, timeInSecond);
    }
}

_updatePageView()
{
    // 当页面数组变化时修改 content 大小
    let layout = this.content.getComponent(cc.Layout);
    if (layout && layout.enabled) {
        layout.updateLayout();
    }

    let pageCount = this._pages.length;

    if (this._curPageIdx >= pageCount) {
        this._curPageIdx = pageCount === 0 ? 0 : pageCount - 1;
        this._lastPageIdx = this._curPageIdx;
    }
    // 进行排序
    for (let i = 0; i < pageCount; ++i) {
        this._pages[i].setSiblingIndex(i);
        if (this.direction === cc.PageView.Direction.Horizontal) {
            this._scrollCenterOffsetX[i] = Math.abs(this.content.x + this._pages[i].x);
        }
        else {
            this._scrollCenterOffsetY[i] = Math.abs(this.content.y + this._pages[i].y);
        }
    }
    
    // 刷新 indicator 信息与状态
    if (this.indicator) {
        this.indicator._refresh();
    }
}`