Apply Touch Swipe on single page ,the page that is used for loading data dynamically?

I have used single page on which data is loaded again and again.

A same page is being used for loading data; ie headline, photo and description. Can you help me so that I can apply swipe function in it?
I am building an application like Pulse News check it on the swipe function.
I have built it in phonegap, HTML5, CSS3 and JavaScript and also jQuery mobile.

  • Calling native method twice of third party library in an Activity causes the Android application to close down
  • Is it better to use multiple SpanObjects or multiple TextViews in Android?
  • How to see the data stored in sqlite in android studio using genymotion as emulator
  • “Native typeface cannot be made” only for some people
  • Phonegap (online build) app - no internet connection and network status
  • android app icon in status bar
  • I know how to to swipe the pages, where are more than one page but there is only one page on which data is loaded dynamically and only the content is changed, so how should I add swipe to it so that it works on iPhone and Android?

    Related posts:

    Rotating video taken in portrait mode
    How to insert a log in LogCat that when I click on it jumps to its line in code?
    Find my air application version in AS3 on iOS and Android
    proguard - AppCompat does not support the current theme features after proguard/minify
    Android JNI functions run on main thread?
    How would you describe the current state of the Android platform?
  • ConstraintLayout: What does `layout_constraintLeft_creator` do in xml?
  • Summary: Take a picture utilizing Camera Intent and display the photo with correct orientation (works on hopefully all devices)
  • Convert integer color value to RGB
  • Brightness Screen Filter
  • Picasso loads pictures to the wrong imageview in a list adapter
  • AndroidAnnotations cannot find symbol class
  • 7 Solutions collect form web for “Apply Touch Swipe on single page ,the page that is used for loading data dynamically?”

    It doesn’t matter how many pages you have in your app. You need to detect SWIPE action in your activity and reload data instead of really swiping pages. to do that:
    in your touch event listener, detect:

    ACTION_MOVE

    like this:

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

    even check the distance to make sure a SWIPE happened:

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

    calculate the distance then, if sounds like more than a click… consider it a swipe and reload your data
    good luck

    Take a look at Hammer.js (http://eightmedia.github.io/hammer.js/) perhaps it will make it easier for you!

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

    I think you might want to consider using a multi-page layout or a panel and transitioning between them using the swipe gesture.

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

    Check-out the code for the jQueryMobile slide dialog here – http://view.jquerymobile.com/1.3.0/docs/widgets/transitions/

    From the jQuery Mobile 1.3.0 Documentation for $.mobile.changePage

    options (object, optional) Properties:

    allowSamePageTransition(boolean, default: false)

    By default, changePage() ignores requests to
    change to the current active page. Setting this option to true, allows
    the request to execute. Developers should note that some of the page
    transitions assume that the fromPage and toPage of a changePage
    request are different, so they may not animate as expected. Developers
    are responsible for either providing a proper transition, or turning
    it off for this specific case.

    It appears that there may be some bugs with this depending on which version of jQuery.Mobile you are using.

    First let ur Activity implements OnTouchListener
    then
    return the gesture detector i.e as follows

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

    then
    now

    urpage.setOnTouchListener(this);
    

    in onCreate method

    Next

    create a class called GestureListener
    in that

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

    AngularJS 1.2 has swipe features built in now too. Maybe worth checking.

    You can modify this code according your requirement.

      $("#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'. 
      });
    
    Android Babe is a Google Android Fan, All about Android Phones, Android Wear, Android Dev and Android Games Apps and so on.