android viewpager实现竖屏滑动效果

Viewpager 横向滑动效果系统就自带了很多种，比如这个

效果

那如果做成竖屏的这种效果呢 。我百度过很多，效果都不是很好，有的代码特别多而且存在很多问题。我结合了以前别人的代码现在来教大家个简单的实现过程。

首先自定义Viewpager 是肯定必不可少的了

public class VerticalViewPager extends ViewPager {
 private OnItemClickListener mOnItemClickListener;

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

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

private void init() {
   // The majority of the magic happens here
   setPageTransformer(true, new VerticalPageTransformer());
   // The easiest way to get rid of the overscroll drawing that happens on the left and right
   setOverScrollMode(OVER_SCROLL_NEVER);
 }
  private MotionEvent swapXY(MotionEvent ev) {
   float width = getWidth();
   float height = getHeight();

float newX = (ev.getY() / height) * width;
   float newY = (ev.getX() / width) * height;

ev.setLocation(newX, newY);

return ev;
 }

@Override
 public boolean onInterceptTouchEvent(MotionEvent ev){
   boolean intercepted = super.onInterceptTouchEvent(swapXY(ev));
   swapXY(ev); // return touch coordinates to original reference frame for any child views
   return intercepted;
 }

private float scaleY ;
 @Override
 public boolean onTouchEvent(MotionEvent ev) {

System.out.println("----------getY" + ev.getY());
   System.out.println("----------scaleY" + scaleY);
   if (ev.getAction()==MotionEvent.ACTION_MOVE){
   }
   if (ev.getAction()==MotionEvent.ACTION_DOWN){
     scaleY = ev.getY();
   }
   if (ev.getAction()==MotionEvent.ACTION_UP){
     if (scaleY == ev.getY()){
       System.out.println("------------------======");
       scaleY= 0;
       return false;
     }
   }
   try {
     return super.onTouchEvent(swapXY(ev));
   }catch (Exception e){
   }
   return true;
 }
 public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
   mOnItemClickListener = onItemClickListener;
 }

public interface OnItemClickListener {
   void onItemClick(int position);
 }
 private void setup() {
   final GestureDetector tapGestureDetector = new  GestureDetector(getContext(), new TapGestureListener());

setOnTouchListener(new OnTouchListener() {
     @Override
     public boolean onTouch(View v, MotionEvent event) {
       tapGestureDetector.onTouchEvent(event);
       return false;
     }
   });
 }
 private class TapGestureListener extends GestureDetector.SimpleOnGestureListener {

@Override
   public boolean onSingleTapConfirmed(MotionEvent e) {
     if(mOnItemClickListener != null) {
       mOnItemClickListener.onItemClick(getCurrentItem());
     }
     return true;
   }
 }

}

要实现动画效果的核心就在 setPageTransformer(true, new VerticalPageTransformer());，大家都知道这个是设置Viewpager 设置动画的方法 ，那么要实现这个如果用系统自带的切换动画效果的话 肯定是不符合Viewpager 竖屏滑动的效果的。所以自定义PageTransformer 就是必然的趋势了

private class VerticalPageTransformer implements ViewPager.PageTransformer {
   private float MIN_SCALE = 0.5f;

@Override
   public void transformPage(View view, float position) {
     if (position < -1) { // [-Infinity,-1)
       // This page is way off-screen to the left.
       view.setAlpha(0);

}else if (position <= 0) { // [-1,1]
       view.setAlpha(1 + position);
       view.setTranslationX(-view.getWidth() * position);
       view.setPivotY( view.getMeasuredHeight());
       view.setPivotX( view.getMeasuredWidth()/2);
       view.setTranslationY( position * view.getHeight());
       float scaleFactor = MIN_SCALE + (1 - MIN_SCALE)
           * (1 - Math.abs(position));
       view.setScaleX(scaleFactor);
       view.setScaleY(scaleFactor);

}
     else if (position <= 1) { // [-1,1]
       view.setAlpha(1);
       view.setTranslationX(-view.getWidth() * position);
       view.setTranslationY( position * view.getHeight());
       float scaleFactor = MIN_SCALE + (1 - MIN_SCALE)
           * (1 - Math.abs(position));

} else { // (1,+Infinity]
       view.setAlpha(0);
       view.setTranslationY( position * view.getHeight());
     }
   }

}

重写transformPage 方法。然后得到如上gif 向左旋转90的效果，剩下的代码你们看看也就知道是item点击事件与滑动事件的监听。所以就不细讲了

来源：https://blog.csdn.net/qq793318828/article/details/78809763