在 Sencha Touch 2 轮播的末尾或开头,用户可以将项目拖过它应该能够到达的位置并显示白色背景(此处的屏幕截图:https://i.stack.imgur.com/i10Ak.png https://i.stack.imgur.com/i10Ak.png)。我正在尝试禁用此功能,因此用户can't拖过轮播的末尾/开头。
我尝试用各种方法来做到这一点scrollable
配置,包括通常建议用于处理过度滚动的设置
scrollable : {
direction: 'horizontal',
directionLock: true,
momentumEasing: {
momentum: {
acceleration: 30,
friction: 0.5
},
bounce: {
acceleration: 0.0001,
springTension: 0.9999,
},
minVelocity: 5
},
outOfBoundRestrictFactor: 0
}
上面的配置,特别是outOfBoundRestrictFactor
确实阻止了拖动超过末尾的能力,但它也阻止了拖动轮播中其他任何地方的能力......所以这是行不通的。我已经尝试了所有其他配置,但没有产生任何积极效果。
不幸的是,我还没有找到太多关于修改拖动配置的信息。这里的任何帮助都会很棒。
你需要做的是覆盖onDrag
轮播中的功能。这是逻辑检测用户拖动方向的位置,以及您可以检查它是第一个还是最后一个项目的位置。
这是一个完全符合您要求的课程。您感兴趣的代码位于该函数的底部。其余的只是简单地摘自Ext.carousel.Carousel
.
Ext.define('Ext.carousel.Custom', {
extend: 'Ext.carousel.Carousel',
onDrag: function(e) {
if (!this.isDragging) {
return;
}
var startOffset = this.dragStartOffset,
direction = this.getDirection(),
delta = direction === 'horizontal' ? e.deltaX : e.deltaY,
lastOffset = this.offset,
flickStartTime = this.flickStartTime,
dragDirection = this.dragDirection,
now = Ext.Date.now(),
currentActiveIndex = this.getActiveIndex(),
maxIndex = this.getMaxItemIndex(),
lastDragDirection = dragDirection,
offset;
if ((currentActiveIndex === 0 && delta > 0) || (currentActiveIndex === maxIndex && delta < 0)) {
delta *= 0.5;
}
offset = startOffset + delta;
if (offset > lastOffset) {
dragDirection = 1;
}
else if (offset < lastOffset) {
dragDirection = -1;
}
if (dragDirection !== lastDragDirection || (now - flickStartTime) > 300) {
this.flickStartOffset = lastOffset;
this.flickStartTime = now;
}
this.dragDirection = dragDirection;
// now that we have the dragDirection, we should use that to check if there
// is an item to drag to
if ((dragDirection == 1 && currentActiveIndex == 0) || (dragDirection == -1 && currentActiveIndex == maxIndex)) {
return;
}
this.setOffset(offset);
}
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)