Применить Touch Swipe на одной странице, странице, которая используется для динамической загрузки данных?

Я использовал одну страницу, на которой данные загружаются снова и снова.

Одна и та же страница используется для загрузки данных; т.е. заголовок, фото и описание. Можете ли вы мне помочь, чтобы я мог применить функцию салфетки? Я создаю приложение, такое как Pulse News, проверяю его на функцию салфетки. Я создал его в телефоне, HTML5, CSS3 и JavaScript, а также jQuery mobile.

Я знаю, как прокручивать страницы, где находится более одной страницы, но есть только одна страница, на которой данные загружаются динамически, и только содержимое изменяется, поэтому как мне добавить салфетки на нее, чтобы она работала iPhone и Android?

Ответ 1

Неважно, сколько страниц у вас в вашем приложении. Вам нужно обнаружить действие SWIPE в вашей деятельности и перезагрузить данные, а не действительно прокручивать страницы. для этого: в вашем прослушивателе событий касания, определите:

ACTION_MOVE

вот так:

if (event.getAction()!= MotionEvent.ACTION_MOVE)

даже проверьте расстояние, чтобы убедиться, что произошел SWIPE:

switch(event.getAction())
 {
     case MotionEvent.ACTION_DOWN:
              if(isDown == false)
              {
                     startX = event.getX();
                     startY = event.getY();
                     isDown = true;
              }
              Break;
              case MotionEvent.ACTION_UP
              {
                     endX = event.getX();
                     endY = event.getY();
                     break;
          }
}

вычислить расстояние тогда, если звучит как нечто большее, чем щелчок... рассмотрите его как салфетки и перезагрузите данные удачи

Ответ 2

Взгляните на Hammer.js(http://eightmedia.github.io/hammer.js/), возможно, вам будет легче!

Hammer(el).on("swipeleft", function() {
    //code to run when user uses swipes left
});

Ответ 3

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

http://view.jquerymobile.com/1.3.0/docs/widgets/pages/#Multi-pagetemplatestructure

Отметьте код для диалога слайда jQueryMobile здесь - http://view.jquerymobile.com/1.3.0/docs/widgets/transitions/

Ответ 4

Из документации jQuery Mobile 1.3.0 для $.mobile.changePage

параметры (объект, необязательный) Свойства:

allowSamePageTransition(boolean, default: false)

По умолчанию changePage() игнорирует запросы на перейдите на текущую активную страницу. Установка этого параметра в значение true, запрос на выполнение. Разработчики должны отметить, что некоторые страницы переходы предполагают, что fromPage и toPage of changePage запрос отличается, поэтому они могут не анимироваться, как ожидалось. Разработчики несут ответственность за обеспечение надлежащего перехода или это для этого конкретного случая.

Похоже, что в этом могут быть некоторые ошибки, зависящие от того, какую версию jQuery.Mobile вы используете.

Ответ 5

Сначала пусть ur Activity реализует OnTouchListener тогда возвратите детектор жеста следующим образом:

public boolean onTouch(final View view, final MotionEvent motionEvent) {
  // TODO Auto-generated method stub
  return gestureDetector.onTouchEvent(motionEvent);
}

то Теперь

urpage.setOnTouchListener(this);

в методе onCreate

создать класс GestureListener в том, что

private final class GestureListener extends SimpleOnGestureListener {

private static final int SWIPE_THRESHOLD = 100;
private static final int SWIPE_VELOCITY_THRESHOLD = 100;

@Override
public boolean onDown(MotionEvent e) {
    return true;
}

@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,

float velocityY) {
    boolean result = false;
    try {
        float diffY = e2.getY() - e1.getY();
        float diffX = e2.getX() - e1.getX();
        if (Math.abs(diffX) > Math.abs(diffY)) {
             if (Math.abs(diffX) > SWIPE_THRESHOLD
               && Math.abs(velocityX) > SWIPE_VELOCITY_THRESHOLD) {
                  if (diffX > 0) {
                       //dynamic load the page which you want when the user swipes left side
                  } else {
                       //dynamic load the page which you want when the user swipes right side
                  }
             }
        }
    } catch (Exception exception) {
        exception.printStackTrace();
    }
    return result;
}

Ответ 6

У AngularJS 1.2 есть встроенные встроенные функции. Возможно, стоит проверить.

Ответ 7

Вы можете изменить этот код в соответствии с вашими требованиями.

  $("#pageID-1").on("swiperight", function() {           
    $.mobile.changePage("#pageID-2", {transition: "slide",reverse: false});         
    getDateienData();   // load data dynamically on page '#pageID-2' when swipe page '#pageID-1'. 
  });