ViewPager 实现 Galler 效果, 中间大图显示,两边小图展示



上一张效果图:

之前的项目有一个Galley的项目,但是代码结构特别乱,别问我为什么,我也是刚接手这个项目,为了方便以后阅读和维护我对一些模块进行了重构。ViewPager实现Galler效果,但是当时时间比较急,写的比较仓促,上一篇实现了简单的效果,但是对于初始的时候左边滑动是有问题的,这是因为我们在自己的Adapter的时候对于getCount,我们想通过Integer.MAX_VALUE来实现无限循环,简单的说这个是向右(无限大)吧,所以也就只是实现了向右的循环,对于像左的还是不行的。

那么怎么解决呢?

首先我们对Adapter还是需要按以前的写法,其实Adapter适配器就是帮我们做界面的,其他的逻辑最好不要加,我之前的想法是用过

viewPager.addOnPageChangeListener来实现,通过判断是否滑到最左边或者最右边来实现循环滑到。

[html] view plain copy

print?

  1. int realPosition = mAdapter.toRealPosition(position);  
  2.            if (mPreviousPosition != realPosition) {  
  3.                mPreviousPosition = realPosition;  
  4.                if (mOuterPageChangeListener != null) {  
  5.                    mOuterPageChangeListener.onPageSelected(realPosition);  
  6.                }  
  7.            }  

这里我封装了一个类,只要将你的ViewPager改为我封装好的ViewPager就行

LoopViewPager 

[html] view plain copy

print?

  1. public class LoopViewPager extends ViewPager {  
  2.   
  3.     private static final boolean DEFAULT_BOUNDARY_CASHING = false;  
  4.   
  5.     private OnPageChangeListener mOuterPageChangeListener;  
  6.     private LoopPagerAdapterWrapper mAdapter;  
  7.     private boolean mBoundaryCaching = DEFAULT_BOUNDARY_CASHING;  
  8.   
  9.     public static int toRealPosition( int position, int count ){  
  10.         position = position-1;  
  11.         if( position < 0 ){  
  12.             position += count;  
  13.         }else{  
  14.             position = position%count;  
  15.         }  
  16.         return position;  
  17.     }  
  18.       
  19.     public void setBoundaryCaching(boolean flag) {  
  20.         mBoundaryCaching = flag;  
  21.         if (mAdapter != null) {  
  22.             mAdapter.setBoundaryCaching(flag);  
  23.         }  
  24.     }  
  25.   
  26.     @Override  
  27.     public void setAdapter(PagerAdapter adapter) {  
  28.         mAdapter = new LoopPagerAdapterWrapper(adapter);  
  29.         mAdapter.setBoundaryCaching(mBoundaryCaching);  
  30.         super.setAdapter(mAdapter);  
  31.         setCurrentItem(0, false);  
  32.     }  
  33.   
  34.     @Override  
  35.     public PagerAdapter getAdapter() {  
  36.         return mAdapter != null ? mAdapter.getRealAdapter() : mAdapter;  
  37.     }  
  38.   
  39.     @Override  
  40.     public int getCurrentItem() {  
  41.         return mAdapter != null ? mAdapter.toRealPosition(super.getCurrentItem()) : 0;  
  42.     }  
  43.   
  44.     public void setCurrentItem(int item, boolean smoothScroll) {  
  45.         int realItem = mAdapter.toInnerPosition(item);  
  46.         super.setCurrentItem(realItem, smoothScroll);  
  47.     }  
  48.   
  49.     @Override  
  50.     public void setCurrentItem(int item) {  
  51.         if (getCurrentItem() != item) {  
  52.             setCurrentItem(item, true);  
  53.         }  
  54.     }  
  55.   
  56.     @Override  
  57.     public void setOnPageChangeListener(OnPageChangeListener listener) {  
  58.         mOuterPageChangeListener = listener;  
  59.     };  
  60.   
  61.     public LoopViewPager(Context context) {  
  62.         super(context);  
  63.         init();  
  64.     }  
  65.   
  66.     public LoopViewPager(Context context, AttributeSet attrs) {  
  67.         super(context, attrs);  
  68.         init();  
  69.     }  
  70.   
  71.     private void init() {  
  72.         super.setOnPageChangeListener(onPageChangeListener);  
  73.     }  
  74.   
  75.     private OnPageChangeListener onPageChangeListener = new OnPageChangeListener() {  
  76.         private float mPreviousOffset = -1;  
  77.         private float mPreviousPosition = -1;  
  78.   
  79.         @Override  
  80.         public void onPageSelected(int position) {  
  81.   
  82.             int realPosition = mAdapter.toRealPosition(position);  
  83.             if (mPreviousPosition != realPosition) {  
  84.                 mPreviousPosition = realPosition;  
  85.                 if (mOuterPageChangeListener != null) {  
  86.                     mOuterPageChangeListener.onPageSelected(realPosition);  
  87.                 }  
  88.             }  
  89.         }  
  90.   
  91.         @Override  
  92.         public void onPageScrolled(int position, float positionOffset,  
  93.                 int positionOffsetPixels) {  
  94.             int realPosition = position
时间: 2024-08-01 20:03:06

ViewPager 实现 Galler 效果, 中间大图显示,两边小图展示的相关文章

ViewPager 实现 Galler 效果, 中间大图显示,两边小图展示(优化篇)

上一张效果图: 之前的项目有一个Galley的项目,但是代码结构特别乱,别问我为什么,我也是刚接手这个项目,为了方便以后阅读和维护我对一些模块进行了重构.ViewPager实现Galler效果,但是当时时间比较急,写的比较仓促,上一篇实现了简单的效果,但是对于初始的时候左边滑动是有问题的,这是因为我们在自己的Adapter的时候对于getCount,我们想通过Integer.MAX_VALUE来实现无限循环,简单的说这个是向右(无限大)吧,所以也就只是实现了向右的循环,对于像左的还是不行的. 那

viewpager加载多张大图导致内存溢出

问题描述 viewpager加载多张大图导致内存溢出 同样的app程序,在原生Android系统上就不出现内存溢出,在华为系统上就会出现内存溢出的情况, viewpager 加载多个布局,每个布局里面都有一张大图,实现了类似于图片游览器的功能. 里面有写回收图片操作和压缩为原图一半的操作

Android 实现ViewPager边界回弹效果实例代码

废话不多说了,直接给大家贴代码了,具体代码如下所示: public class BounceBackViewPager extends ViewPager { private int currentPosition = 0; private Rect mRect = new Rect();//用来记录初始位置 private boolean handleDefault = true; private float preX = 0f; private static final float RATI

《移动App测试的22条军规》——第23章,第6节测试微信App的消息显示和通知展示

23.6 测试微信App的消息显示和通知展示以Android操作系统为例,我们不仅需要检查安装微信App时向用户申请的权限(如图23.18所示),还需要验证在微信App收到新的消息时,如何通过通知向用户进行消息展示(如图23.19所示).

《移动App测试的22条军规》—App测试综合案例分析23.6节测试微信App的消息显示和通知展示

23.6 测试微信App的消息显示和通知展示以Android操作系统为例,我们不仅需要检查安装微信App时向用户申请的权限(如图23.18所示),还需要验证在微信App收到新的消息时,如何通过通知向用户进行消息展示(如图23.19所示).

jQuery插件图片列表切换,点击小图列表大图显示

效果可以直接使用,但是尚未封装,等封装后方便插件下载.    代码如下 复制代码 <html><head>   <title>腾讯娱乐图片预览的网站特效,已经进行了解析和优化,方便了解其html css原理.</title>   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">         <style type

AndroidUI组件SlidingTabLayout实现ViewPager页滑动效果_Android

使用SlidingTabLayout需要准备2个类,分别是 SlidingTabLayout,与SlidingTabStrip,,放进项目中时只用修改下包名即可. 效果制作的不是很好. 这篇文章,也是在网上搜了很多资源参考,对 SlidingTabLayout.java和SlidingTabStrip.java进行了修改.大家可以更改他的格式字体大小.选中状态,分割线调整等等.先上传这两个文件,改动支出都做了注释. SlidingTabLayout.java /* * Copyright (C)

jQuery实现鼠标跟随提示层效果代码(可显示文本,Div,Table,Html等)_jquery

本文实例讲述了jQuery实现鼠标跟随提示层效果代码.分享给大家供大家参考,具体如下: 运行效果截图如下: Web网站有不少需要用到tip提示层的地方,结合jquery的jquery.cluetip.js ,可以实现本地字符或ajax异步调用显示提示层.如以上购评分明细提示.(优势:宽度需要调用页加载时定义,高度auto , 且三角指定图标能根据显示层的大小位置来调用它的位置,达到醒目直观的效果) jquery.cluetip.css /* global */ #cluetip-close im

AndroidUI组件SlidingTabLayout实现ViewPager页滑动效果

使用SlidingTabLayout需要准备2个类,分别是 SlidingTabLayout,与SlidingTabStrip,,放进项目中时只用修改下包名即可. 效果制作的不是很好. 这篇文章,也是在网上搜了很多资源参考,对 SlidingTabLayout.java和SlidingTabStrip.java进行了修改.大家可以更改他的格式字体大小.选中状态,分割线调整等等.先上传这两个文件,改动支出都做了注释. SlidingTabLayout.java /* * Copyright (C)