How to disable swiping in specific direction in ViewPager2

Question

I want to disable right to left swipe in ViewPager2. I basically have a viewpager2 element with 2 pages in my navigation drawer. I want my second page to show up only when I click some element in my first page (right to left swipe from the first page should not open the second page), while when I'm in the second page, the viewpager2 swipe (left to right swipe) should swipe as it should do in viewpager.

I've tried extending the ViewPager2 class and override the touch events, but unfortunately it ViewPager2 is a final class, so I cannot extend it.

Secondly, I tried to use setUserInputEnabled method to false, but this disabled all swipes altogether (I just want to disable right to left swipe). If I could find some listener which checks for the current page before swiping and disable swipe otherwise, it would probably work.

     implementation 'androidx.viewpager2:viewpager2:1.0.0-alpha05'

Code for setting up of ViewPager2

      ViewPager2 pager = view.findViewById(R.id.pager);
      ArrayList<Fragment> abc = new ArrayList<>();
      abc.add(first);
      abc.add(second);
      navigationDrawerPager.setAdapter(new DrawerPagerAdapter(
                this, drawerFragmentList));
      pager.setAdapter(new FragmentStateAdapter(this), abc);

Answer 1

Solution for more than 2 Fragments.

If you know enough about Android go straight to the CODE... if don't:

In reality this solution aims to mimic the absence of a page in a given direction

So instead of using the code bellow I would rather recommend:

Disabling the swiping function for the entire ViewPager2 and allow navigation only via tabs. One can then add or remove tabs to make it seem as if Fragments are being added or removed.

To make use of a 100% functional swiping function there is at least 2 behaviors that still require fixing which are discussed after the code.

Code

It's been awhile(8/21/2022), and I finally took the time to test some issues with the code and came up with a better solution:

public enum Direction {
    allow_all(null),
    right_to_left(Resolve.r2L()),
    left_to_right(Resolve.l2R()),
    left_and_right(Resolve.lR()); // NOT TESTED SHOULD IGNORE

    Direction(Resolve resolve) {
        this.resolve = resolve;
    }

    @FunctionalInterface
    private interface Resolve {
        boolean resolve(float prev, float next);

        static Resolve r2L() {
            return (prev, next) -> prev > next;
        }
        static Resolve l2R() {
            return (prev, next) -> prev < next;
        }
        static Resolve lR() {
            return (prev, next) -> prev != next; //THIS REQUIRES TESTING
        }
    }

    private final Resolve resolve;

    public static class Resolver {
        float prev;
        long prevTime;
        Direction toBlock = allow_all;
        public boolean shouldIntercept(MotionEvent event) {
            if (toBlock == allow_all) return false;
            long nextTime = event.getDownTime();
            float next = event.getX();
            boolean intercept = false;
            if (prevTime == nextTime) {
                intercept = toBlock.resolve.resolve(prev, next);
            } else {
                prevTime = nextTime;
            }
            prev = next;
            return intercept;
        }

        public void setToBlock(Direction toBlock) {
            if (this.toBlock != toBlock) {
                this.toBlock = toBlock;
                prev = 0;
            }
        }
    }
}

Inside the Adapter...

public class MyAdapter extends FragmentStateAdapter {

    private final Direction.Resolver resolver = new Direction.Resolver();

    @Override
    public void onAttachedToRecyclerView(@NonNull RecyclerView recyclerView) {
        recyclerView.addOnItemTouchListener(
                new RecyclerView.SimpleOnItemTouchListener(){

                    @Override
                    public boolean onInterceptTouchEvent(@NonNull RecyclerView rv, @NonNull MotionEvent e) {
                        return resolver.shouldIntercept(e);
                    }
                }
        );

        super.onAttachedToRecyclerView(recyclerView);
    }

    public void disableDrag(Direction direction) {
        resolver.setToBlock(direction);
    }

    public void enableDrag() {
        resolver.setToBlock(Direction.allow_all);
    }
}

The drawbacks:

**

• A) onPageSelected:

**

the setToBlock(Direction) method should be executed upon page change. The question is then: What should call it / When should I call it?

And I don't have the answer for that... My best guess is that placing the method inside the ViewPager's onPageSelected callback listener would be a good place.... but there is an issue with this listener.

        viewPager2.registerOnPageChangeCallback(
                new ViewPager2.OnPageChangeCallback() {

                    @Override
                    public void onPageSelected(int position) {
                        if (position == 2) mAdapter.enableDrag(); return;
                        if (position == 1) mAdapter.disableDrag(left_to_right)

                    }
                }
        );

The listener sometimes registers a page change BEFORE the swapping animation ends, when a certain finger fling is used.

This means that for a fraction of a second the fling is subjected to the Direction rule of the incoming page, but in reality the swapping is still on the previous page.

In the example above, the mAdapter.enableDrag(); occurs at position 2. Let's say that position 0 should be disallowed, so position 1's rule is mAdapter.disableDrag(left_to_right) so that postiion 0 cannot be reached.

If I fling the finger in such a way so that the ViewPager register's a position change to 2 (eanbleDrag()) and then fling in the opossite direction without lifting the finger, the page turns back from a half rendered position 2 to position 0 which should be inaccessible.

This is not hard to reproduce 1 out of 5 attempts, but you need to actively want to reproduce it.

I don't know how to fix this.

Maybe the disableDrag() call should be done at a much later stage in the swapping, but that implies accessing the Page Fragment's lifecycle. which means using the setTargetFragment() method (The "clean" way) and I would rather die than use that.

An alternative is using a shared ViewModel bound to the backStackEntry for ViewPagerFrag to PageFrag (Fragment to Fragment) communication.

Off course... let's ignore for a moment that both of this methods use static fields behind curtains for reference storage... Which means you can absolutely go the public static way, that is of course you keep the code clean...

**

• B) Restricting swipes in one direction.

**

In reality this solution aims to mimic the absence of a page in a given direction, the issue is that If we carefully decompose the behavior of page absence, we notice that the animation restricts motion only once a given axis has been reached, to be more precise, the restriction becomes a reality once the LAST page(index 0) is fully displayed, if the page of index 0 slides off screen towards index 1, even in the slightest, you can still swipe the page towards 0 again.

By restricting the movement in one direction and let this rule govern THE ENTIRE PAGE, an unwanted behavior occurs:

Example: [position 0(disallowed)] - [1(allowed)] - [2(allowed)]

To mimic the absence of position 0, position 1 must disableDrag(left_to_rigth); If we drag our finger from 1, towards 2, and then GENTLY drag it back (maybe because the user changed their minds and decided to stay on page 1)..., Then, because the entire page is ruled by toBlock direction == left_to_rigth, the page will refuse to go back, and the animation will get stuck in between both fragments.

My guess is that the disabling should be performed once a given Fragment Y axis has reached a given trigger Y axis in the screen (AKA: Using a screen coordinates listener), this implies more knowledge on all the different available listeners that the component gives us access to. ... So...

This is the best I can do for now, I would really appreciate any advice on how to solve this or maybe tackle the main issue which is the addition and removal of fragments without losing states. Even though I hardly see this being a possibility (at least with the StateAdapter) since the DiffUtil would be required to infer reordering changes and I believe the Mayer's algo is not meant to deal with that level of inference (reordering inference ("index jump")).Instead the Mayers only works by inferring whole segment reordering.

Also the Fragment collection would be required to behave both as LIFO AND FIFO (I believe the term is carousel???), in order to support additions and removals from both ends, Top (prohibiting left-to-right access) AND Bottom (prohibiting right-to-left access).

I think this is both too much and too specific to be a necessary enhancement to the ViewPager2 tool.

Because I lack knowledge on all these details...IMHO the best solution would be:

To disable the swiping function for the entire ViewPager2 and allow navigation only via tabs. One can then add or remove tabs to make it seem as if Fragments are being added or removed.

Answer 2

Simplest Solution for more than 2 Fragments:

int previousPage = 0;
pager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        super.onPageScrolled(position, positionOffset, positionOffsetPixels);
        if(position < previousPage){
            pager.setCurrentItem(previousPage, false);
        } else {
            previousPage = position;
        }
    }
});

Answer 3

I found a listener which can listen when the user tries to swipe, it'll then check the current page, if it's the first page, disable the user input else enable it as it was by default.

Here's the code snippet for that

In Java:

pager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
    @Override
    public void onPageScrollStateChanged(int state) {
        super.onPageScrollStateChanged(state);

        if (state == SCROLL_STATE_DRAGGING && pager.getCurrentItem() == 0) {
            pager.setUserInputEnabled(false);
        } else {
            pager.setUserInputEnabled(true);
        }
    }
});

In Kotlin:

viewPager.registerOnPageChangeCallback(object : OnPageChangeCallback() {
    override fun onPageScrollStateChanged(state: Int) {
        super.onPageScrollStateChanged(state)

        viewPager.isUserInputEnabled = !(state == SCROLL_STATE_DRAGGING && viewPager.currentItem == 0)
    }
})

Since my scenario was of 2 pages only, checking the page number would be good for me, but in case we have more than 2 pages and we need to disable the swipe in one particular direction, we may use onPageScrolled(int position, float positionOffset, int positionOffsetPixels) listener of viewpager2 and handle the desired scenario according to the positive or negative values of position and positionOffset.

Answer 4

Extend the viewpager class and override the functions onInterceptTouchEvent and onTouchEvent. Then identify the direction of the swipe and return false if you don't want to swipe.

You can use this helper method for swipe detection:

float downX;  // define class level variable in viewpager 
private boolean wasSwipeToLeftEvent(MotionEvent event){
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            downX = event.getX();
            return false;

        case MotionEvent.ACTION_MOVE:
        case MotionEvent.ACTION_UP:
            return event.getX() - downX > 0;

        default:
            return false;
    }
}

Then in your method for touch events:

@Override
public boolean onInterceptTouchEvent(MotionEvent event) {


    return !this.wasSwipeToLeftEvent(event);
}

@Override
public boolean onTouchEvent(MotionEvent event) {

    return return !this.wasSwipeToLeftEvent(event);
}

I modified the code from this answer, if you need more explanation please see this: https://stackoverflow.com/a/34111034/4428159