Реализация горизонтальной / вертикальной прокрутки с помощью пальца в Android Honeycomb Webview / WebKit? - PullRequest
20 голосов
/ 10 октября 2011

Я планирую внедрить приложение для планшетов Honeycomb на основе WebView (так что в основном это будет веб-приложение на HTML5 , предназначенное только для планшета ).

Я хочу реализовать горизонтальную и вертикальную прокрутку, проводя пальцем. Для лучшего понимания я создал образец схемы.

Horizontal Scrolling by Swiping


На этом изображении показано что-то похожее на настройку Honeycomb с вертикальной прокруткой левой и правой страниц. Vertical Scrolling by Swiping

Любые руководства или ресурсы приветствуются. Спасибо

Ответы [ 5 ]

12 голосов
/ 16 октября 2011

Взгляните на iScroll :

iScroll 4 - это полное переписывание исходного кода iScroll . Разработка сценария началась потому, что мобильный веб-набор (на iPhone, iPad, Android) не предоставляет встроенного способа прокрутки содержимого внутри элемента фиксированной ширины / высоты. Эта неудачная ситуация не позволяет любому веб-приложению иметь заголовок и / или нижний колонтитул position:absolute и центральную область прокрутки содержимого.

В то время как последние версии Android поддерживают эту функцию (хотя поддержка не является оптимальной), Apple, похоже, неохотно добавляет прокрутку одним пальцем в div ...

5 голосов
/ 06 января 2014

Hammer JS был полезен для меня:

http://eightmedia.github.io/hammer.js/

5 голосов
/ 16 октября 2011

Вот что я нашел до сих пор:

Это зависит от того, как вы хотите реализовать прокрутку.Если вы хотите прикрепить событие смахивания, то это самый простой способ реализовать с использованием хорошо известных библиотек:

  • jqTouch - это событие смахивания влево и вправо, котороеможно подключить для прокрутки влево или вправо (кажется, что все анимации на основе webkit работают только на устройствах iOS). Обратите внимание, что проект все еще находится в стадии бета-тестирования и не очень активен. РЕДАКТИРОВАТЬ: это также входит в состав Sencha Labs - который активно поддерживает Sencha Touch.
  • Sencha Touch - у них улучшена поддержка практически всего на мобильных устройствах и планшетах. (Примечание: это бесплатно для приложений с открытым исходным кодом, но не для коммерческих приложений - РЕДАКТИРОВАТЬ: на самом деле они имеют коммерческую лицензию. Дополнительную информацию о лицензировании см. На их сайте)
  • jQueryMobile - Они очень стабильны (в RC1 на данный момент) и имеют размах влево и вправо, но я не смог найти размах вверх или вниз.Если вам просто нужно провести пальцем влево или вправо, нажмите, нажмите и удерживайте, затем перейдите к jQM.Они имеют лучшую поддержку сообщества.
  • RAW JS - Наконец, если вы хотите что-то сырое, JavaScript, посетите HTML5Rocks статью , чтобы лучше понять, как сенсорныйсобытие работает.

Надеюсь, это поможет.Я все еще изо всех сил пытаюсь реализовать прокрутку вверх, так как я не хочу ждать окончания свайпа, вместо этого я пытаюсь реализовать мгновенную обратную связь прокрутки, получая очень близко, используя координаты RAW JS, но не удовлетворительно.

2 голосов
/ 08 сентября 2012

От создателей iScroll SwipeView кажется хорошей выделенной альтернативой.Взгляните на demo 1 и demo 2 .

Я еще не тестировал, но обязательно буду.Так как демо ведут себя хорошо на моем iPad.

0 голосов
/ 18 января 2012

Вы можете найти эту библиотеку весьма полезной: https://github.com/cubiq/2-way-iScroll

Он обрабатывает случай вертикальной прокрутки и горизонтального пролистывания.

...