ViewPager系列之ViewPager无限循环滑动

12人阅读 评论(0) 收藏 举报
分类:

目前ViewPager实现无限循环有2种方法,直接上具体方法:


方法1:重写 PagerAdapter 中的 getCount() 方法。其实只是在计算item 数目的时候给了一个很大的数,然后通过调用setCurrentItem(position)方法,相当于把起始位置放到了中间的某个位置而已。这里在重写instantiateItem()方法的时候,记得角标的大小,这里就就不上具体代码了。

@Override
public int getCount() {
    return Integer.MAX_VALUE;
}
  • 1
  • 2
  • 3
  • 4
  • 5

方法2:重写了 OnPageChangeListener 接口中的onPageSelected 方法。先上一下效果图,大家一定要留意git图的页面切换效果。

ViewPager无限循环

gif图效果看的不明显,其实这里是有瑕疵的。在循环的第一张和最后一张会有点不太协调(我这里是蓝色海洋和 路飞艾斯这两张图片的切换),之前录了个清晰的git可以清楚的看到这一点,但是因为图片上传不能超过2M,修改gif后看得不明显了,具体的还是自己尝试下才清楚。


ViewPager无限循环原理分析:

ViewPager真实无限循环

如果旧数据是的结构是 List 1,2,3。 那么拼接的新数据格式为List 3,1,2,3,1。

初始化我们让ViewPager指向position=1这个位置,也就是List<旧数据的第一条数据>。如果向左滑动,那么当前显示的List<0>这个页面,也就是List<新数据的第一条数据>,这会儿我们让ViewPager重新指向红色3的位置,也就是List<新数据长度-2>。这样ViewPager就可以向左向右进行滑动了。

如果当前位置是在红色3的页面,也就是List<旧数据最后一条>数据对应的页面。如果向右滑动,那么当前显示的List<新数据长度-1>这个也页面,当滑动到这个页面时会重新setCurrentItem 指定到第一条数据。


ViewPager无限循环Demo代码

xml 布局

    <android.support.v4.view.ViewPager
         android:id="@+id/viewPager"
         android:layout_width="match_parent"
         android:layout_height="match_parent">        
    </android.support.v4.view.ViewPager>
  • 1
  • 2
  • 3
  • 4
  • 5

Activity 代码

        // 留意这里的顺序。
        list2.add(R.drawable.image_08);
        list2.add(R.drawable.image_06);
        list2.add(R.drawable.image_07);
        list2.add(R.drawable.image_08);
        list2.add(R.drawable.image_06);

        mVviewPager = (ViewPager) findViewById(R.id.viewPager);
        // 这里的MultiplePagerAdapter2不用管,我直接用的其他的adapter.具体的看需求了。
        MultiplePagerAdapter2 adapter2 = new MultiplePagerAdapter2(this, list2);
        mVviewPager.setAdapter(adapter2);
        // 初始化指定位置
        mVviewPager.setCurrentItem(1);
        // 重点看下面的代码
        mVviewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            int currentPosition;

            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                currentPosition = position;
            }

            @Override
            public void onPageScrollStateChanged(int state) {
                // ViewPager.SCROLL_STATE_IDLE 标识的状态是当前页面完全展现,并且没有动画正在进行中,如果不
                // 是此状态下执行 setCurrentItem 方法回在首位替换的时候会出现跳动!
                if (state != ViewPager.SCROLL_STATE_IDLE) return;

                // 当视图在第一个时,将页面号设置为图片的最后一张。
                if (currentPosition == 0) {
                    mVviewPager.setCurrentItem(list2.size() - 2, false);

                } else if (currentPosition == list2.size() - 1) {
                    // 当视图在最后一个是,将页面号设置为图片的第一张。
                    mVviewPager.setCurrentItem(1, false);
                }
            }
        });
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44

ViewPager无限循环两种方法比较:

流畅性:第一种方法 显然要比第二种方法要流畅很多。

应用场景: 如果只是让用户自行滑动跳转pager 的话,我比较推荐第一种。毕竟流畅性要好很多。如果是定时无限循环的话,可以尝试用第二种方法。当然具体在pager转场动画里是直接跳转还是有个过渡动画来缓冲一下,看具体的项目中更适合哪种了。


介绍下 setCurrentItem (int item, boolean smoothScroll) 和 setCurrentItem (int item) 的区别。

其实谷歌文档已经介绍的很详细了。

public void setCurrentItem (int item, boolean smoothScroll)
Set the currently selected page. // 设定当前选择的页面
参数
item int: Item index to select
smoothScroll boolean: True to smoothly scroll to the new item, false to transition immediately
// 如果smoothScroll 为true,则平滑滚动到指定页面,false 则直接跳转到指定页面

public void setCurrentItem (int item)
Set the currently selected page. If the ViewPager has already been through its first layout with its current adapter there will be a smooth animated transition between the current item and the specified item.
// 设定当前选择的页面。如果ViewPager 已经通过指定页面,那么将会在当前iten 与指定item 有一个平滑的过渡动画。
参数
item int: Item index to select

查看评论

ViewPager系列之ViewPager无限循环滑动原理、代码、2种实现方法比较

ViewPager无限循环2种方法。方法1:重写 PagerAdapter 中的 getCount() 方法。方法2:重写了 OnPageChangeListener 接口中的onPageSelect...
  • JM_beizi
  • JM_beizi
  • 2016-05-02 17:17:59
  • 9216

ViewPager实现真正的左右无限循环滑动

最近由于项目需要需要实现类似于广告那种
  • ywl5320
  • ywl5320
  • 2014-11-04 22:57:25
  • 3160

Android ViewPager 实现无限循环滑动

先高亮一个问题向大家请教,谢谢大家!就是用PagerTabStripe实现时,title总是在文字的中间,怎么能让标题在view的左上角呢?谢谢大家!图是在随便找的,就是怎么让这个“Nearby”显示...
  • u012572538
  • u012572538
  • 2014-03-11 12:42:59
  • 2636

Android Fragment+ViewPager实现循环滑动

关于实现ViewPager循环滑动的方法有几种,之前用过加最大值的方法,但是有点问题,所以本篇文章主要介绍的是前后各加一个项的方法,首先看代码(布局代码我就不贴出来了,太简单了,就是一个viewpag...
  • u014483723
  • u014483723
  • 2015-07-27 16:46:50
  • 2413

ViewPager无限循环滑动+自动播放

ViewPager无限循环滑动+自动播放 最近在研究使用ViewPager实现banner广告,但是ViewPager本身并不能实现循环滑动。网上查找到两种方法:1. 将ViewPager设置一个...
  • u011451706
  • u011451706
  • 2016-11-13 21:03:45
  • 322

Android ViewPager 无限循环左右滑动(可自动) 实现

对于ViewPager 广告页 这个功能 很多APP都有这个功能 在网上也看过一些资料,我就在这把我自己完整的实现方法写出来吧 Demo放在最下面 基础的ViewPager: ...
  • u012760183
  • u012760183
  • 2016-08-17 14:43:51
  • 6277

ViewPager无限循环滑动无卡顿,详解OnPageChangeListener

说下OnPageChangeListener这个接口的三个方法: onPageScrolled(int position, float positionOffset, int positionOffs...
  • happy_fsyy
  • happy_fsyy
  • 2016-07-27 22:29:54
  • 2659

ViewPager实现左右无限循环效果

在网上找了很多,发现都是一个原理
  • oWeiXiao123
  • oWeiXiao123
  • 2014-04-11 17:26:37
  • 39036

真无限循环的ViewPager——解决两端滑动的平滑问题

使用ViewPager实现图片轮播应该是大家很熟悉的做法。但是ViewPager有个缺点,不支持循环播放,滚到最右边不能继续右滚,同样,滚到最左边也不能继续左滚。这是个令人头疼的事情,好在程序员们神通...
  • u010829418
  • u010829418
  • 2016-01-06 17:36:17
  • 6478
    个人资料
    等级:
    访问量: 653
    积分: 110
    排名: 125万+
    文章分类
    文章存档