android viewpager实现竖屏滑动效果

 更新时间:2018年07月17日 09:15:25   作者:ben羽毛  
这篇文章主要为大家详细介绍了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点击事件与滑动事件的监听。所以就不细讲了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • Android使用硬件加速的方式

    Android使用硬件加速的方式

    硬件加速是指利用设备的硬件资源来加速图形渲染和图像处理等操作,以提高应用程序的性能和用户体验,Android使用硬件加速的目的是为了提高图形渲染的性能和效果,本文给大家详细介绍了Android如何使用硬件加速,需要的朋友可以参考下
    2023-10-10
  • Android开发之使用GridView展示图片的方法

    Android开发之使用GridView展示图片的方法

    这篇文章主要介绍了Android开发之使用GridView展示图片的方法,涉及Android使用GridView操作图片的布局与图片调用功能实现技巧,需要的朋友可以参考下
    2016-01-01
  • iOS开发中TableView类似QQ分组的折叠与展开效果

    iOS开发中TableView类似QQ分组的折叠与展开效果

    这篇文章主要介绍了iOS开发中TableView类似QQ分组的折叠与展开效果,其实要做这个效果我先想到的是在tableView中再嵌套多个tableView。下面通过本文给大家分享实现思路,需要的朋友可以参考下
    2016-12-12
  • RxJava两步打造华丽的Android引导页

    RxJava两步打造华丽的Android引导页

    如今,移动应用对首次使用的用户呈现欢迎页已经越来越普遍了。这样做的目的就是向用户介绍并展示我们的应用。本文给Android开发的引导页面提供了很多参考,非常值得一读。
    2016-07-07
  • Android下的POS打印机调用的简单实现

    Android下的POS打印机调用的简单实现

    本篇文章主要介绍了Android下的POS打印机调用的简单实现,非常具有实用价值,需要的朋友可以参考下
    2017-04-04
  • Android实现带磁性的悬浮窗体效果

    Android实现带磁性的悬浮窗体效果

    这篇文章主要介绍了Android实现带磁性的悬浮窗体效果,涉及Android针对窗体的动态操作相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2016-07-07
  • Android使用TabLayout+Fragment实现顶部选项卡

    Android使用TabLayout+Fragment实现顶部选项卡

    本文通过实例代码给大家介绍了Android使用TabLayout+Fragment实现顶部选项卡功能,包括TabLyout的使用,感兴趣的朋友参考下本文吧
    2017-05-05
  • Android使用Photoview实现图片左右滑动及缩放功能

    Android使用Photoview实现图片左右滑动及缩放功能

    这篇文章主要为大家详细介绍了Android使用Photoview实现图片左右滑动及缩放功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-01-01
  • Android边播放边缓存视频框架AndroidVideoCache详解

    Android边播放边缓存视频框架AndroidVideoCache详解

    这篇文章主要为大家介绍了Android边播放边缓存视频框架AndroidVideoCache详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-09-09
  • Android实战之Cocos游戏容器搭建

    Android实战之Cocos游戏容器搭建

    这篇文章主要介绍了Android实战之Cocos游戏容器搭建,文章围绕主题展开详细的内容介绍,具有一定的参考价值,感兴趣的小伙伴可以参考一下
    2022-06-06

最新评论