Android自定义ViewPager实现纵向滑动翻页效果
抖音几乎已经成为了我们日常生活中使用比较频繁的App，无聊之时或工作之后可以刷一刷短视频来供我们娱乐与放松。看到抖音的视屏切换效果，觉得用ViewPager可以做出一样的效果。想一想之前用的ViewPager都是横向切换的，虽然很经常用，但是从来没实现过竖向的切换效果，说做就做吧。
我们先看一波效果图：
那么，要想实现这样的效果，当然是自定义ViewPager啦。问了一下度娘，看到有这样一种思路：
首先，把Touch事件的x,y坐标做一下交换，从原先的x坐标差值转变成y坐标的差值，正符合了我们手指从横向滑动转成了纵向滑动。其次，再通过实现PageTransformer接口，改变view的平移方向，便实现了如上效果。
下面我们贴出代码，并理解一下整个实现过程。
public class VerticalViewPager extends ViewPager {
public VerticalViewPager(Context context) {
super(context);
}
public VerticalViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean onTouchEvent(MotionEvent ev) {
return super.onTouchEvent(swapTouchEvent(MotionEvent.obtain(ev)));
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
return super.onInterceptTouchEvent(swapTouchEvent(MotionEvent.obtain(ev)));
}
private MotionEvent swapTouchEvent(MotionEvent event) {
float width = getWidth();
float height = getHeight();
event.setLocation((event.getY() / height) * width, ((event.getX() / width) * height));
return event;
}
}
首先，我们自定义一个继承ViewPager的类，我们重点关注一下swapTouchEvent()方法。这个方法是将MotionEvent事件的x坐标换成y坐标，而y坐标换成x坐标。当然，这个是参考百度的，我们理解了就好。其实现实在妙不可言！
public class VerticalPageTransformer implements ViewPager.PageTransformer {
@Override
public void transformPage(View view, float position) {
/**
* 0 当前界面
* -1 前一页
* 1 后一页
*/
if (position >= -1 && position <= 1) {
view.setTranslationX(view.getWidth() * -position);
float yPosition = position * view.getHeight();
view.setTranslationY(yPosition);
}
}
}
上部分代码，实现了界面由原来的横向平移到纵向平移的过程。其思路是这样的，我画了一个草图（凑合看，毕竟连幼儿园都没毕业，画画功底~~）
这张图描述了我们手机的屏幕，我们知道ViewPager，默认是把三个界面横向着排一起的，现在我们将其改为纵向的。
如果手指向下滑动，也就是第一个界面（绿色的），它将会进入到我们的屏幕，然而当前页（红色的）将退出屏幕，这是一套完整的流程，手指向上滑动，则方向相反。
view.setTranslationX(view.getWidth() * -position); float yPosition = position * view.getHeight(); view.setTranslationY(yPosition);
这是对ViewPager中所有子View的x,y坐标进行平移使它能够排成纵向一排。代码不难，就是对x,y坐标的平移处理。例如：
绿色的：它的position为-1，对y坐标而言,平移它的view高度。也就是-height，对x坐标而言，则平移它的width*-position，那它就跑到红色的头上了，现在我们往下滑动手指，它就进入屏幕了。
总体来说，大致实现就是这样，只要理清思路便可以很快的理解。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
最近公司项目需要实现类似微信进度条弹出框效果，其实现方法并不难，下面给大家介绍下Android仿微信进度弹出框的实现方法，需要的朋友参考下吧2017-01-01
这篇文章主要介绍了android通过拼音搜索中文的功能实现代码,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-11-11
这篇文章主要介绍了Android实现的数字格式化用法,结合实例形式分析了Android数学运算中数字格式化输出的相关技巧,需要的朋友可以参考下2016-08-08
线程死锁是老生常谈的问题，线程池死锁本质上属于线程死锁的一部分，线程池造成的死锁问题往往和业务场景相关，本文主要介绍了Android 线程死锁场景与优化，感兴趣的可以了解一下2023-12-12
通过Html网页调用本地安卓(android)app程序代码
如何使用html网页和本地app进行传递数据呢？经过研究，发现还是有方法的，总结了一下，大致有一下几种方式2013-11-11
这篇文章主要为大家详细介绍了Android利用属性动画实现优酷菜单，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-01-01
如何通过Battery Historian分析Android APP耗电情况
Android 从两个层面统计电量的消耗，分别为软件排行榜及硬件排行榜。它们各有自己的耗电榜单，软件排行榜为机器中每个 App 的耗电榜单，硬件排行榜则为各个硬件的耗电榜单。这两个排行榜的统计是互为独立，互不干扰的2021-06-06
本文主要介绍了Android中使用EditText控制禁止输入空格和回车的实现代码。具有很好的参考价值。下面跟着小编一起来看下吧2017-04-04
这篇文章主要介绍了Android基于ImageView绘制的开关按钮效果,结合实例形式分析了Android使用ImageView进行按钮绘制的界面布局、功能实现及相关注意事项,需要的朋友可以参考下2017-03-03
这篇文章主要为大家整理了5种Android数据存储方式，列出了各存储方式的优缺点，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
最新评论