Ograniczanie siatki Kendo do przewijania w jednym kierunku na ekranie dotykowym

Question

Gdy użytkownik znajduje się na urządzeniu z ekranem dotykowym, chciałbym ograniczyć przewijanie po przekątnej - dlatego należy wymusić przewijanie w jednym kierunku na raz - w poziomie lub w pionie.

Ustawiłem JS Fiddle, które wykrywa, czy przewijanie dotykowe jest włączone i jestem w stanie wyprowadzić współrzędne X i Y. Ale nie widzę przesunięcia ani niczego i potrzebuję tej figury, aby obliczyć zamierzony kierunek.

Wiem, że jabłko używa directionalLockEnabled, które będzie ograniczać, więc zastanawiam się, czy coś takiego jest dostępne w Kendo. Jeśli nie, może istnieje sposób, w jaki mogę określić, w którym kierunku użytkownik ma zamiar przewinąć i "zamrozić" drugą współrzędną.

JS (skrzypce I stworzył odpowiedni udział w metodzie dataBound):

http://jsfiddle.net/dmathisen/tskebcqp/

(odpowiedni kod działa tylko na dotyk ... ale powinien działać po włączeniu mobilnej emulacji w dev narzędzi)

Inną kwestią jest liczba przypadków wywołania zdarzenia przewijania. Kiedy pracuję, może uda mi się ustawić odbicie, aby poradzić sobie z częstotliwością uruchamiania.

Answer 1

Jeśli chcesz używać javascript dla tej poprawki, możesz obliczyć zakresy ruchów X i Y. Do tego z urządzeniami dotykowymi, ustawić początek thrashowym tempem i wpływem X i Y kiedy touchstart i CALCUL odległości gdy touchmove

var touchY = touchX = 0; 
    $(document).delegate('.yourWrap', 'touchstart', function(e){ 
     touchX = e.originalEvent.touches[0].pageX; 
     touchY = e.originalEvent.touches[0].pageY; 
    }); 
    $(document).delegate('.yourWrap', 'touchmove', function(e){ 

     if (Math.abs(touchX - e.originalEvent.touches[0].pageX) 
      > Math.abs(touchY - e.originalEvent.touches[0].pageY)) { 
      // Block overflow-y 
     } else { 
      // Block overflow-x 
     } 
     touchX = e.originalEvent.touches[0].pageX; 
     touchY = e.originalEvent.touches[0].pageY; 
    }); 

Dla urządzeń kół, porównaj Delta

(e.wheelDeltaY/3 || -e.deltaY) 
(e.wheelDeltaX/3 || -e.deltaX)