自动轮播 ViewPager

最新推荐文章于 2021-05-27 12:05:08 发布
最新推荐文章于 2021-05-27 12:05:08 发布
阅读量357 收藏 1
点赞数 1
分类专栏： Android 文章标签： ViewPager 自动轮播 viewPager.setCurrentItem()卡
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhishenluo/article/details/83041255
版权

1. 概述

1.1 特点

  1. 代码入侵性小, 修改一下类名即可, 不需要更换适配器
  2. 通过代码绘制指示器, 没有指示器布局文件和没有指示器资源文件
  3. 支持设置 ViewPager 切换时间
  4. 可通过 adapter.notifyDataSetChanged() 动态更新数据, 解决 setCurrentItem(int item) 卡顿

1.2 关于 ViewPager.setCurrentItem() 卡顿

尝试以下方案无效
  • 设置为不平滑切换, 发现没有任何效果; ViewPager.setCurrentItem(currentItem, false)
  • 调用 setCurrentItem() 前设置 ViewPager.mScrolle 滑动时间为 0
  • 调用 setCurrentItem() 前设置 ViewPager.mFirstLayout ＝ true
  • 重新设置 Adapter
问题分析
  1. 在测试过程中发现在第一次设置 Adapter 的时候调用 ViewPager.setCurrentItem() 不会卡顿, 而在 adapter.notifyDataSetChanged() 时再调用 ViewPager.setCurrentItem() 却会卡顿
  2. 通过 Android Profiler 中的 CPU 模块的 Methed trace 发现是在 ViewPager.populate() 卡顿了
    // ViewPager.setCurrentItem() 源码
    void setCurrentItemInternal(int item, boolean smoothScroll, boolean always, int velocity) {
        ..............
        final boolean dispatchSelected = mCurItem != item;

        if (mFirstLayout) {        // 第一次进入该分支, 我们后续调用 setCurrentItem() 也是进入该分支就可以了 
            mCurItem = item;
            if (dispatchSelected) {
                dispatchOnPageSelected(item);
            }
            requestLayout();        // 如果仅仅只修改 mFirstLayout=true, 该函数最终还是会调用 populate()
        } else {
            populate(item);         // 调用这个函数卡顿了
            scrollToItem(item, smoothScroll, velocity, dispatchSelected);
        }
    }
解决方案
  1. 重新设置 Adapter
  2. 修改 mFirstLayout ＝ true
private void selectFirstItem() {

            stopPlay();

            // 必须重新设置 setAdapter 并将 mFirstLayout 设置为 true, 防止进入 ViewPager.populate(), 避免卡顿
            setAdapter(null);
            setField("android.support.v4.view.ViewPager", AutoPlayViewPager.this, "mFirstLayout", true);
            setAdapter(adapter);

            if (adapter.getCount() > 0) {
                int currentItem = Integer.MAX_VALUE >> 1;
                currentItem = currentItem - currentItem % adapter.getCount();
                setCurrentItem(currentItem, false);
            }
        }

2. 完整代码和使用

2.1 AutoPlayViewPager

public class AutoPlayViewPager extends ViewPager {

    private Paint paint;
    private int position;
    private int size = 15;
    private int selected = Color.RED;
    private int background = 0x66FFFFFF;

    private int displayTime = Integer.MAX_VALUE;
    private final AtomicBoolean isPlaying = new AtomicBoolean(false);
    private final AutoPlayScroller autoPlayScroller;

    private PagerAdapter adapter;
    private final AtomicBoolean dataSetObserverRegistered = new AtomicBoolean(false);


    public AutoPlayViewPager(@NonNull Context context) {
        this(context, null);
    }

    public AutoPlayViewPager(@NonNull Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        addOnPageChangeListener(mListener);

        paint = new Paint();
        paint = new Paint();
        paint.setAntiAlias(true);
        paint.setStyle(Paint.Style.FILL);

        autoPlayScroller = new AutoPlayScroller(context);
        setField("android.support.v4.view.ViewPager", this, "mScroller", autoPlayScroller);
    }


    @Override
    public void setAdapter(@Nullable PagerAdapter adapter) {

        if (adapter == null) {
            super.setAdapter(null);
            return;
        }

        // 1. 包装原 adapter, 使其支持无限轮播
        super.setAdapter(new AutoPlayAdapter(adapter));
        this.adapter = adapter;

        // 防止重复设置 Adapter 导致注册报错
        if (dataSetObserverRegistered.get()) {
            adapter.unregisterDataSetObserver(mDataSetObserver);
        }
        adapter.registerDataSetObserver(mDataSetObserver);
        dataSetObserverRegistered.set(true);

        // 2. 确保默认选中的是第一个页面和第一个圆点
        if (adapter.getCount() > 0) {
            int currentItem = Integer.MAX_VALUE >> 1;
            currentItem = currentItem - currentItem % adapter.getCount();
            setCurrentItem(currentItem, false);
        }
    }


    /**
     * 开始自动播放
     * @param displayTime : 页面显示时间
     */
    public void startPlay(int displayTime) {

        this.displayTime =  displayTime;
        if (adapter == null || adapter.getCount() <= 1)
            return;

        stopPlay();
        isPlaying.set(true);
        postDelayed(player, this.displayTime);
    }

    /**
     * 停止播放
     */
    public void stopPlay() {
        removeCallbacks(player);
        isPlaying.set(false);
    }


    // 循环播放消息
    private final Runnable player = new Runnable() {

        @Override
        public void run() {
            if (isPlaying.get()) {
                setCurrentItem(getCurrentItem() + 1, true);
                postDelayed(player, displayTime);
            }
        }
    };

    /**
     * 设置切换时间
     * @param duration 切换时间(ms), 默认 600ms
     */
    public void setSwitchDuration(int duration) {
        if (duration >= displayTime) {
            throw new IllegalArgumentException("The augment duration must less than displayTime!");
        }
        autoPlayScroller.setDuration(duration);
    }


    /**
     * 设置圆点样式
     * @param size       圆点大小
     * @param background 圆点背景色
     * @param selected   圆点前景色
     */
    public void setPointStyle(int size, int background, int selected) {
        this.size = size;
        this.selected = selected;
        this.background = background;
        invalidate();
    }


    /**
     * 绘制圆点指示器
     * @param canvas 画布
     */
    @Override
    public void draw(Canvas canvas) {
        super.draw(canvas);

        final int count = adapter == null ? 0 : adapter.getCount();
        if (count < 1) return;

        canvas.save();
        canvas.translate(getScrollX(), getScrollY());

        float x = (getWidth() - size * count * 2) / 2 + size;
        float y = getHeight() - size;

        paint.setColor(background);
        for (int i = 0; i < count; i++) {
            canvas.drawCircle(x + i * size * 2, y, size >> 1, paint);
        }

        paint.setColor(selected);
        canvas.drawCircle(x + position * size * 2, y, size >> 1, paint);

        canvas.restore();
    }


    /**
     * 防止用户手动滑动后, 马上又播放下一张
     */
    private final OnPageChangeListener mListener = new ViewPager.SimpleOnPageChangeListener() {

        @Override
        public void onPageScrollStateChanged(int state) {
            if (state == ViewPager.SCROLL_STATE_IDLE) {
                startPlay(displayTime);
            } else if (state == ViewPager.SCROLL_STATE_DRAGGING) {
                stopPlay();
            }
        }

        @Override
        public void onPageSelected(int pos) {
            if (adapter.getCount() > 0) {
                position = pos % adapter.getCount();
                invalidate();
            }
        }
    };



    /**
     * 用于支持 Adapter.notifyDataSetChanged()
     */
    private final DataSetObserver mDataSetObserver = new DataSetObserver() {

        @Override
        public void onChanged() {
            update();
        }

        @Override
        public void onInvalidated() {
            update();
        }

        private void update() {

            if (getAdapter() == null)
                return;

            getAdapter().notifyDataSetChanged();
            selectFirstItem();

            if (displayTime != Integer.MAX_VALUE) {
                startPlay(displayTime);
            }
        }

        private void selectFirstItem() {

            stopPlay();

            // 1. 设置 mFirstLayout = true
            setField("android.support.v4.view.ViewPager", AutoPlayViewPager.this, "mFirstLayout", true);
            
            // 2. 重新设置 adapter
            setAdapter(null);
            setAdapter(adapter);

            if (adapter.getCount() > 0) {
                int currentItem = Integer.MAX_VALUE >> 1;
                currentItem = currentItem - currentItem % adapter.getCount();
                setCurrentItem(currentItem, false);
            }
        }
    };

    @Override
    protected void onDetachedFromWindow() {
        stopPlay();
        removeOnPageChangeListener(mListener);
        if (adapter != null && dataSetObserverRegistered.get()) {
            adapter.unregisterDataSetObserver(mDataSetObserver);
            dataSetObserverRegistered.set(false);
        }
        super.onDetachedFromWindow();
    }


    // 反射设置类字段
    public static boolean setField(String className, Object object, String filedName, Object filedValue) {
        try {
            Class clazz = Class.forName(className);
            Field field = clazz.getDeclaredField(filedName);
            field.setAccessible(true);
            field.set(object, filedValue);
            return true;
        } catch (Exception e) {
            e.printStackTrace();
        }
        return false;
    }



    private static class AutoPlayAdapter extends PagerAdapter {

        private final PagerAdapter adapter;

        AutoPlayAdapter(PagerAdapter adapter) {
            if (adapter == null)
                throw new NullPointerException("adapter is null!");
            this.adapter = adapter;
        }

        @Override
        public int getCount() {
            if (adapter.getCount() <= 1)
                return adapter.getCount();
            return Integer.MAX_VALUE;
        }

        @Override
        public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
            return adapter.isViewFromObject(view, object);
        }

        @NonNull
        @Override
        public Object instantiateItem(@NonNull ViewGroup container, int position) {
            if (adapter.getCount() > 0) {
                return adapter.instantiateItem(container, position % adapter.getCount());
            }
            return null;
        }

        @Override
        public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
            if (adapter.getCount() != 0) {
                adapter.destroyItem(container, position % adapter.getCount(), object);
            }
        }

        @Nullable
        @Override
        public CharSequence getPageTitle(int position) {
            if (adapter.getCount() != 0) {
                return adapter.getPageTitle(position % adapter.getCount());
            }
            return "";
        }
    }


    private static class AutoPlayScroller extends Scroller {

        private int duration = 600;

        AutoPlayScroller(Context context) {
            super(context, interpolator);
        }

        private static final Interpolator interpolator = (t) -> {
            t -= 1.0f;
            return t * t * t * t * t + 1.0f;
        };

        @Override
        public void startScroll(int startX, int startY, int dx, int dy, int duration) {
            super.startScroll(startX, startY, dx, dy, Math.max(duration, this.duration));
        }

        void setDuration(int duration) {
            this.duration = duration;
        }
    }
}

2.2 测试代码

public class TestAutoPlayViewPager extends BaseActivity {

    private AutoPlayViewPager viewPager;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.test_auto_play_viewpager_layout);
        init();
    }

    private void init() {

        List<Map.Entry<Integer, String>> data = new ArrayList<>();
        data.add(new AbstractMap.SimpleEntry<>(R.mipmap.aaa, "Page-1"));
        data.add(new AbstractMap.SimpleEntry<>(R.mipmap.bbb, "Page-2"));
        data.add(new AbstractMap.SimpleEntry<>(R.mipmap.ccc, "Page-3"));

        PagerAdapter adapter = getPagerAdapter(data);
        viewPager = findViewById(R.id.view_page);

        viewPager.setAdapter(adapter);
        viewPager.setSwitchDuration(800);
        viewPager.setPointStyle(UiUtil.dp2px(10), 0x66FFFFFF, Color.RED);

        // 测试动态数据更新
        viewPager.postDelayed(() -> {
            data.add(new AbstractMap.SimpleEntry<>(R.mipmap.dddd, "Page-4"));
            adapter.notifyDataSetChanged();
        }, 4000);
    }

    @Override
    protected void onStart() {
        super.onStart();
        viewPager.startPlay(2000);
    }

    @Override
    protected void onStop() {
        super.onStop();
        viewPager.stopPlay();                 // 停止播放, 节省资源
    }

    private PagerAdapter getPagerAdapter(final List<Map.Entry<Integer, String>> data) {

        return new PagerAdapter() {

            @Override
            public int getCount() {
                return data == null ? 0 : data.size();
            }

            @Override
            public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
                return view == object;
            }

            @NonNull
            @Override
            public Object instantiateItem(@NonNull ViewGroup container, int position) {

                TextView view = new TextView(getBaseContext());
                view.setText(data.get(position).getValue());
                view.setBackgroundResource(data.get(position).getKey());

                container.addView(view);
                return view;
            }

            @Override
            public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
                if (container != null && object != null && object instanceof View) {
                    container.removeView((View) object);
                }
            }
        };
    }
}
百里奔跑
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
自动滚动的ViewPager
pengkv的专栏
12-07 3332
效果图：使用方法：AutoScrollViewPager viewPager = (AutoScrollViewPager) findViewById(R.id.vp_photos);viewPager.setDataList(mUrlList); viewPager.updateView(0); viewPager.setIsAutoScroll(true); viewPager.setIsSho
Android使用ViewPager实现图片轮播系列之二：自动轮播
最新发布
2401_84123077的博客
04-22 279
总而言之，Android开发行业变化太快，作为技术人员就要保持终生学习的态度，让学习力成为核心竞争力，所谓“活到老学到老”只有不断的学习，不断的提升自己，才能跟紧行业的步伐，才能不被时代所淘汰。在这里我分享一份自己收录整理上述技术体系图相关的几十套腾讯、头条、阿里、美团等公司20年的面试题，把技术点整理成了视频和PDF（实际上比预期多花了不少精力），包含知识脉络 + 诸多细节，由于篇幅有限，这里以图片的形式给大家展示一部分。
解决viewpager 重新可见时，切换page无动画
专注Android ，直到世界尽头
09-04 1526
ViewPager 重新可见时bug 项目场景 最近项目正在做自动轮播的banner效果，出现了几种意想不到的问题。 1：由于banner是放在recyclerview 中的head中，所有当滑动recyclerview 至banner到屏幕外再回来， 会发现，viewpager第一次切换pager 无动画效果，也就是翻页速度很快。 2：当从别的fragment页面中切换到有banner的fragment中的时候，也就是banner中的fragment由 isVisibleToUser=false
ViewPager循环滑动及自动播放
02-15
实现viewpager的左右循环滑动功能及自动播放
ViewPager自动播放
05-13
ViewPager自动播放，带标记点，点击事件，滑动时暂停播放
自动轮播viewpager
03-29
这个"自动轮播viewpager"是对原生ViewPager的扩展，增加了自动轮播和动态添加圆点指示器的功能，使得它更适合于制作如广告轮播图、图片画廊等场景。 首先，我们来深入理解一下ViewPager的基本概念。ViewPager是...
Android使用ViewPager实现自动轮播
01-04
很多APP中都实现了类似引导页的自动轮播，不由得想到昨天的引导页上修改一下代码实现轮播。 其实大体上只需要添加一个线程循环执行就可以了。  项目已同步至：https://github.com/nanchen2251/viewpagerDemo  ...
Android循环轮播ViewPager
09-28
为了实现自动轮播，可以使用`Handler`和`Runnable`组合。在`Runnable`中改变`ViewPager`的当前页面，并在`Handler`的`postDelayed()`方法中设置定时执行，从而实现定期切换。别忘了在不需要轮播时移除这个`Runnable`...
无限轮播Viewpager
04-04
总结来说，"无限轮播ViewPager"是通过自定义Adapter和处理拖拽事件来实现的，结合自动滚动功能和引导图展示，可以为用户提供一个直观且无缝的滑动体验。在实际开发中，我们还需要考虑性能优化，比如减少内存占用、...
无限轮播viewpager
05-22
无限轮播ViewPager是一种常见的UI组件，常用于展示广告、推荐内容等，用户可以在滑动时体验无缝衔接的滚动效果。在Android开发中，通常通过自定义ViewPager实现这一功能。在这个基于MVP（Model-View-Presenter）模式...
ViewPager手动滑动和自动滑动无限循环滑动加载
03-16
ViewPager手动滑动和自动滑动，无限循环滑动加载，第一个页面和最后一个循环切换正常，自动循环每次切换的时间间隔可以自己修改，项目编码UTF-8默认编译版本2.3.3。
Viewpager 自动轮播（无限循环） ，手动滑动时停止轮播+底部小圆点
11-17
本Demo支持网络获取图片，底部动态小圆点，以及无限循环轮播，当手动触摸时停止自动轮播
android viewpager自动循环滑动,Android ViewPager实现无限循环效果
weixin_30037665的博客
05-27 356
最近项目里有用到ViewPager来做广告运营位展示，看到现在很多APP的广告运营位都是无限循环的，所以就研究了一下这个功能的实现。先看看效果从一个方向上一直滑动，么有滑到尽头的感觉，具体是怎么实现的呢？看下面的思路。实现思路此处画了一幅图来表达实现无限循环的思路，即在数据起始位置前插入最后一项数据，在最后一项数据后插入第一项数据，当滑动到此处时，更新页面的索引位置就ok了 。代码实现这个方法用于...
Android ViewPager的无限循环与自动滚动实现
rainmonth的专栏
09-26 7400
本文简要描述了Android中ViewPager两个常用功能——自动滚动和无限循环的具体实现思路，如有不当出处，欢迎指正。
ViewPager + RecyclerView的显示问题
yjs1129580545的专栏
09-07 7293
Recyclerview 添加viewpager作为头部的显示bug
ViewPager自动轮播，手指按住停止轮播
那些年我们一起写的代码
10-14 3567
前面写了ViewPager添加指示器，无限轮播，自动轮播。但是自动轮播有一个问题就是手指按住后要停止轮播才行。
整理Viewpager无限轮播控件
xuwb123xuwb的博客
04-04 441
一 自定义viewpagerAdapter   1、最大值设置：getcount  返回 为Interger.MAXVALUE   2、轮播之后View的移除  【防止重复添加view】public class ImageAdapter extends PagerAdapter { private Context context; //轮播需要的图片 public Arra...
关于ViewPager设置属性页setCurrentItem会阻塞主线程ANR总结
weixin_34195546的博客
01-24 481
  关于android开发设置View Pager的直接跳转页set CurrentItem会阻塞主线程ANR。 根据网上解决的说法，分析源码：   if (mFirstLayout) { // We don't have any idea how big we are yet and shouldn't have any pages either. // Just set th...
ViewPager实现自动轮播
08-06
要实现ViewPager的自动轮播，你可以按照以下步骤进行操作： 1. 首先，在布局文件中添加ViewPager控件，并设置其相关属性，如布局宽高、指示器等。 2. 在代码中，创建一个Handler对象和一个Runnable对象，用于实现...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值