Android: Vertical ViewPager [closed]

Answer 1

Check this out : https://github.com/JakeWharton/Android-DirectionalViewPager

Or the following question may help you: Vertical 'Gridview with pages' or 'Viewpager'

Answer 2

Even I was facing the same problem with making ViewPager vertical by swapping X and Y. It was not at all smooth.

That's because it used to work only when the angle of swiping was less than 7.125 degrees = arctan (1/8) while intercept and 14 degrees = arctan (1/4) while touch; as original ViewPager horizontal one work when the angle of swiping is less than 26.565 degrees = arctan (1/2) while intercept and 45 degrees = arctan (1) while touch.

That's why I copied the code of Android support-core-ui and moved the values to variables, which I multiplied using reflection.

Please find the code and README at https://github.com/deepakmishra/verticalviewpager and VerticalViewPager at https://github.com/deepakmishra/verticalviewpager/blob/master/app/src/main/java/com/viewpager/VerticalViewPager.java

Answer 3

I ended up creating a new DirectionalViewPager that can scroll either vertically or horizontally because all of the solutions I've seen here have flaws:

1. Existing VerticalViewPager implementations (by castorflex and LambergaR)

   • They are based on very old support library versions.

2. Transformation trick with coordinate swapping

   • The overscroller is still shown from the left/right edges.
   • Page flinging doesn't work properly, because even with the coordinates swapped, VelocityTracker.computeCurrentVelocity still calculates the velocity with the X axis, probably because this internally uses a native call that ignores the coordinate swap.

3. View rotation

   • Hack that needs every child view to be rotated too.
   • If you want to read coordinates for something else you have to swap the axis.

Answer 4

I have a solution that works for me in two steps.

1. onInstantiateItem() of PagerAdapter, create the view and rotate it by -90:

   view.setRotation(-90f)
   

   If you are using FragmentPagerAdapter, then:

   objFragment.getView().setRotation(-90)
   

2. Rotate ViewPager view by 90 degree:

   objViewPager.setRotation(90)
   

Works like a charm at least for my requirement.

Answer 5

There are a few open source projects which claim to do this. Here they are:

• kaelaela/VerticalViewPager, latest commit in Oct 2015 and one contributor
• castorflex/VerticalViewPager, latest commit in Feb 2014 and three contributors
• LambergaR/VerticalViewPager/, latest commit in Aug 2013 and one contributor

These have been marked deprecated by their authors:

• Deprecated: Android Directional-ViewPager by JakeWharton https://github.com/JakeWharton/Android-DirectionalViewPager

And one more thing:

• There is also a file name VerticalViewPager.java in the Android source from the deskclock app, but it doesn't seem to be officially supported as I can't find documentation for it.

Answer 6

import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

public class VerticalViewPager extends ViewPager {

    public VerticalViewPager(Context context) {
        super(context);
        init();
    }


    public VerticalViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }
    private void init() {

        setPageTransformer(true, new VerticalPageTransformer());

        setOverScrollMode(OVER_SCROLL_NEVER);
    }

    private class VerticalPageTransformer implements PageTransformer {

        @Override
        public void transformPage(View view, float position) {
            int pageWidth = view.getWidth();
            int pageHeight = view.getHeight();

            if (position < -1) {

                view.setAlpha(0);

            } else if (position <= 1) {
                view.setAlpha(1);


                view.setTranslationX(pageWidth * -position);


                float yPosition = position * pageHeight;
                view.setTranslationY(yPosition);

            } else {

                view.setAlpha(0);
            }
        }
    }
        @Override
    public boolean onTouchEvent(MotionEvent ev) {

        ev.setLocation(ev.getY(), ev.getX());

        return super.onTouchEvent(ev);
    }
    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev) {
        ev.setLocation(ev.getY(), ev.getX());
        return super.onInterceptTouchEvent(ev);
    }
}