ViewPager实现滑动翻页效果
实现ViewPager的滑动翻页效果可以使用ViewPager的setPageTransformer方法,如下:
import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.View; public class ReadViewPager extends ViewPager
{
public ReadViewPager(Context context)
{
super(context);
} public ReadViewPager(Context context, AttributeSet attrs)
{
super(context, attrs);
setAnima();
} public void setAnima()
{
setPageTransformer(true, new PageTransformer()
{
private static final float MIN_SCALE = 0.75f; @Override
public void transformPage(View view, float position)
{ int pageWidth = view.getWidth();
int pageHeight =view.getHeight(); if (position < -)
{
// [-Infinity,-1)
// This page is way off-screen to the left.
view.setAlpha(); }
else if (position <= )
{
// [-1,0]
// Use the default slide transition when moving to the left page
view.setAlpha();
view.setTranslationX();
view.setScaleX();
view.setScaleY();
}
else if (position <= )
{
// (0,1] // Fade the page out.
view.setAlpha( - position);
//
// // Counteract the default slide transition
// view.setAlpha(1);
view.setTranslationX(pageWidth * -position);
//
// // Scale the page down (between MIN_SCALE and 1)
float scaleFactor = MIN_SCALE
+ ( - MIN_SCALE) * ( - Math.abs(position));
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
}
else
{
// (1,+Infinity]
// This page is way off-screen to the right.
view.setAlpha();
}
} });
}
}
核心代码是android官方demo,以上实现的是翻页效果是:上面一页被滑出界面时,下面一页慢慢显现,透明度慢慢加大,并且大小由小慢慢变大。
不过有一个奇怪的现象,当我做一个答题界面时,刚刚开始我采用ViewPager与View结合实现无限循环切换,并且采用上面的动画效果,可是每当我滑动到最后一张,也就是要开始新的一轮循环的时候,被滑出去的一页也会出现慢慢变透明的情况,而我用ViewPager结合Fragment实现无限循环切换的是就不会出现这种效果
后来发现大概是因为我在适配器里面加上了下面这个方法才会造成上面的奇怪现象,所以下面的方法不能写下
// PagerAdapter只缓存三张要显示的图片,如果滑动的图片超出了缓存的范围,就会调用这个方法,将图片销毁
//在这里不能重写
// @Override
public void destroyItem(ViewGroup container, int position, Object object) {
//// super.destroyItem(container, position, object);
// }
如果想要实现仿造驾考宝典的翻页效果,只要把核心方法改为以下代码便可以了
setPageTransformer(true, new PageTransformer() {
private static final float MIN_SCALE = 0.75f;
@Override
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
int pageHeight =view.getHeight();
if (position < -) { // [-Infinity,-1)
// This page is way off-screen to the left.
view.setAlpha();
} else if (position <= ) { // [-1,0]
// Use the default slide transition when moving to the left page
view.setAlpha();
view.setTranslationX();
view.setScaleX();
view.setScaleY();
} else if (position <= ) { // (0,1]
// Fade the page out.
// view.setAlpha(1 - position);
//
// // Counteract the default slide transition
view.setAlpha();
view.setTranslationX(pageWidth * -position);
//
// // Scale the page down (between MIN_SCALE and 1)
// float scaleFactor = MIN_SCALE
// + (1 - MIN_SCALE) * (1 - Math.abs(position));
// view.setScaleX(scaleFactor);
// view.setScaleY(scaleFactor);
} else { // (1,+Infinity]
// This page is way off-screen to the right.
view.setAlpha();
}
}
});
下面我们来讲讲position参数:
position的可能性的值有:
[-Infinity,-1) 已经看不到了
(1,+Infinity] 已经看不到了
[-1,1]
重点看[-1,1]这个区间 , 其他两个的View都已经看不到了~~
假设现在ViewPager在A页现在滑出B页,则:
A页的position变化就是( 0, -1]
B页的position变化就是[ 1 , 0 ]
参考博客:http://blog.csdn.net/lmj623565791/article/details/40411921
http://www.jianshu.com/p/251592d3ec62
ViewPager实现滑动翻页效果的更多相关文章
- 微信里经常看到的滑动翻页效果,slide
上个星期我们的产品姐姐让我帮她写个微信里经常看到的滑动翻页效果,今天抽空写了3个小demo(只写了webkit需要chrome模拟手机看 开启touch事件), 故此写个随笔. 1.demo1,整个大 ...
- 桌面浏览器实现滑动翻页效果(Swiper)
还是那个号称很炫的B/S展示软件,在液晶屏上展示需要有滑动翻页的效果(在同一页面滑动切换内容,不是切换页面),最后确定使用功能很强大的Swiper类库. 具体优点可参考:http://www.chin ...
- 基于vue实现上下滑动翻页效果
18年年底的时候,一直在做年度报告的H5页面,因为项目需要,需要实现上下滑动翻页,并且上滑的页面比正常页面的比例要缩小一定比例. 效果类似于http://www.17sucai.com/pins/de ...
- vue案例 - vue-awesome-swiper实现h5滑动翻页效果
说到h5的翻页,很定第一时间想到的是swiper.但是我当时想到的却是,vue里边怎么用swiper?! 中国有句古话叫:天塌下来有个高的顶着. 在前端圈里,总有前仆后继的仁人志士相继挥洒着热汗(这里 ...
- 转载 vue-awesome-swiper - 基于vue实现h5滑动翻页效果
说到h5的翻页,很定第一时间想到的是swiper.但是我当时想到的却是,vue里边怎么用swiper?! 中国有句古话叫:天塌下来有个高的顶着. 在前端圈里,总有前仆后继的仁人志士相继挥洒着热汗(这里 ...
- js实现移动端手指左右上下滑动翻页效果
var ele = document.getElementsByClassName("img-box")[0]; var beginX, beginY, endX, endY, s ...
- jquery插件实现上下滑动翻页效果
<!DOCTYPE > <meta charset="utf-8" /> <head> <title>测试jquery</ti ...
- 【解决ViewPager在大屏上滑动不流畅】 设置ViewPager滑动翻页距离
在项目中做了一个ViewPager+Fragment滑动翻页的效果,在模拟器和小米手机上测试也比较正常.但是换到4.7以上屏幕测试的时候发现老是滑动失效. 因为系统默认的滑动策略是当用户滑动超过半屏之 ...
- webapp应用--模拟电子书翻页效果
前言: 现在移动互联网发展火热,手机上网的用户越来越多,甚至大有超过pc访问的趋势.所以,用web程序做出仿原生效果的移动应用,也变得越来越流行了.这种程序也就是我们常说的单页应用程序,它也有一个英文 ...
随机推荐
- 关于在vscode中以https方式请求!不是以file文件夹访问!vscode中 ajax请求
在vscode 头疼的问题是 用浏览器查看网页!会是以文件夹的方式打开的! 我遇到这个问题 我还重新配置了Apache ! 但是现在可以解决: 使用vscode ============== ...
- Linux编程 22 shell编程(输出和输入重定向,管道,数学运算命令,退出脚本状态码)
1. 输出重定向 最基本的重定向是将命令的输出发送到一个文件中.在bash shell中用大于号(>) ,格式如下:command > inputfile.例如:将date命令的输出内容, ...
- 不得不提的volatile及指令重排序(happen-before)
微信公众号[程序员江湖] 作者黄小斜,斜杠青年,某985硕士,阿里 Java 研发工程师,于 2018 年秋招拿到 BAT 头条.网易.滴滴等 8 个大厂 offer,目前致力于分享这几年的学习经验. ...
- linux服务器部署tomcat和Nginx
项目需要,申请了三台测试机器,好在测试机里面光秃秃的什么都没有,我就可以好好的学习一把玩一把了!接下来以图文的形式讲一下我所碰到的坑以及小小的收获吧! 一.准备工作 首先你得有一台可以玩的linux服 ...
- MySQL的使用及优化
前言 最近听了公司里的同事做的技术分享,然后觉得对自己还是挺有帮助的.都是一些日常需要注意的地方,我们目前在开发过程中,其实用不到MySQL太深的内容的.只是能适用我们日常开发的知识就可以了.所以我将 ...
- Go基础系列:Go实现工作池的两种方式
worker pool简介 worker pool其实就是线程池thread pool.对于go来说,直接使用的是goroutine而非线程,不过这里仍然以线程来解释线程池. 在线程池模型中,有2个队 ...
- OJ:访问 const 成员函数问题
Description 补足程序使得其输出结果是: 40 #include <iostream> #include <string> using namespace std; ...
- rsync+inotify实现全网自动化数据备份-技术流ken
rsync简介 “rsync是linux系统下的数据镜像备份工具.使用快速增量备份工具Remote Sync可以远程同步,支持本地复制,或者与其他SSH.rsync主机同步” rsync的功能和特点 ...
- advanced installer重新打包教程
一.简介 本次利用Advanced Installer软件里的Repackager重封装工具进行测试制作MSI安装包,还开可以利用Advanced Installerr制作MSI安装包 原理为执行两次 ...
- C#序列化与反序列化。
序列化介绍: 把对象用一种新的格式来表示. 系列化只序列化数据. 序列化不建议使用自动属性 为什么要序列化: 将一个复杂的对象转换流,方便存储与信息交换. class Program { static ...