11

我使用了一次又一次加载数据的单页。

同一个页面正在用于加载数据；即标题、照片和说明。你能帮我，以便我可以在其中应用滑动功能吗？我正在构建一个像 Pulse News 这样的应用程序，在滑动功能上检查它。我已经在 phonegap、HTML5、CSS3 和 JavaScript 以及 jQuery mobile 中构建了它。

我知道如何滑动页面，其中不止一页，但只有一页动态加载数据并且仅更改内容，所以我应该如何添加滑动以使其适用于 iPhone 和 Android ?

4

7 回答 7

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;
          }
}

然后计算距离，如果听起来不仅仅是点击...考虑一下滑动并重新加载您的数据祝你好运

于 2013-08-16T23:50:42.397 回答
1

看看 Hammer.js ( http://eightmedia.github.io/hammer.js/ ) 也许它会让你更容易！

Hammer(el).on("swipeleft", function() {
    //code to run when user uses swipes left
});
于 2013-10-23T10:49:52.000 回答
0

您可以根据需要修改此代码。 

  $("#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'. 
  });
于 2013-11-19T14:01:19.440 回答
0

我认为您可能需要考虑使用多页布局或面板，并使用滑动手势在它们之间进行转换。

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

在此处查看 jQueryMobile 幻灯片对话框的代码 - http://view.jquerymobile.com/1.3.0/docs/widgets/transitions/

于 2013-03-08T15:11:34.990 回答
0

来自 jQuery Mobile 1.3.0 文档$.mobile.changePage

选项（对象，可选）属性：

allowSamePageTransition(boolean, default: false)

默认情况下，changePage() 忽略更改到当前活动页面的请求。将此选项设置为 true，允许执行请求。开发人员应注意，某些页面转换假定 changePage 请求的 fromPage 和 toPage 不同，因此它们可能无法按预期进行动画处理。开发人员负责提供适当的过渡，或针对这种特定情况将其关闭。

根据您使用的 jQuery.Mobile 版本，这似乎可能存在一些错误。

于 2013-04-27T00:55:48.423 回答
0

首先让你的 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;
}
于 2013-09-25T17:56:11.863 回答
0

AngularJS 1.2 现在也内置了滑动功能。也许值得检查。

于 2013-11-19T09:36:47.990 回答