2013-01-19 64 views
3

在Sencha Touch 2旋轉木馬的末端或開始處,用戶可以將其拖到應該能夠去的地方並顯示白色背景(屏幕截圖在這裏:http://i.imgur.com/MkX0sam.png)。我試圖禁用此功能,因此用戶不能將拖到輪播結束/開始處。禁用Sencha Touch中的旋轉木馬過卷/過度支撐

我已經嘗試用各種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不會停止拖動過去年底的能力,但它也阻止了拖動旋轉木馬中其他任何地方的能力...所以這是行不通的。我把所有其他配置搞砸了,沒有任何積極影響。

不幸的是,我一直無法找到更多關於修改拖動配置。這裏的任何幫助將是真棒醬。

回答

5

您需要做的是覆蓋Carousel中的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); 
    } 
}); 
+0

太棒了,這個工程。謝謝! –

+0

這將禁用從列表中的最後一項開始的過度滾動,但會從其他項目中過度滾動。通過拖拽第二個項目比最後一個項目的寬度更多,仍然可以進行過度滾動。 –