自动滚动的ViewPager

效果图:

使用方法:

AutoScrollViewPager viewPager = (AutoScrollViewPager) findViewById(R.id.vp_photos);

viewPager.setDataList(mUrlList);
viewPager.updateView(0);
viewPager.setIsAutoScroll(true);
viewPager.setIsShowDot(true);

步骤一:在value的attrs.xml文件里添加自定义样式

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="AutoScrollViewPager">
        <attr name="autoscroll" format="boolean" />
        <attr name="show_navgation_dot" format="boolean" />
    </declare-styleable>
</resources>

步骤二:

添加 Android-Universal-Image-Loader Jar包(当然也可以用其他的加载网络图片工具)

步骤三:自定义view

/**
 * Created by pengkv on 15/12/5.
 */
public class AutoScrollViewPager extends FrameLayout implements View.OnClickListener {
    private Context mContext;
    private List<String> mDataList;//图片地址集合
    private int mBofPosition;
    private boolean isShowDot;//是否显示小点
    private boolean isAutoScroll;//是否自动滚动
    private List<View> mViewList;
    private ViewPager mViewPager;
    private LinearLayout mDotLayout;//放置小点的容器
    private MyPagerAdapter mPagerAdapter;
    private ViewPagerRollHelper mRollHelper;//控制滚动的工具类
    private ViewPager.LayoutParams mImageParams;//图片的布局参数
    private LinearLayout.LayoutParams mDotParams;//小点的布局参数
    private FrameLayout.LayoutParams mViewPagerParams;//ViewPager的布局参数
    private FrameLayout.LayoutParams mDotLayoutParams;//放置小点容器的布局参数

    public AutoScrollViewPager(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public AutoScrollViewPager(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mContext = context;
        TypedArray array = mContext.obtainStyledAttributes(attrs, R.styleable.AutoScrollViewPager, defStyleAttr, 0);
        isAutoScroll = array.getBoolean(R.styleable.AutoScrollViewPager_autoscroll, true);
        isShowDot = array.getBoolean(R.styleable.AutoScrollViewPager_show_navgation_dot, true);
        array.recycle();
    }

    public void setIsAutoScroll(boolean isAutoScroll) {
        this.isAutoScroll = isAutoScroll;
    }

    public void setIsShowDot(boolean isShowDot) {
        this.isShowDot = isShowDot;
    }

    public void setDataList(List<String> mDataList) {
        this.mDataList = mDataList;
        initView();
    }

    private void initView() {
        mViewList = new ArrayList<>();

        //初始化图片布局参数
        mImageParams = new ViewPager.LayoutParams();
        mImageParams.width = ViewGroup.LayoutParams.MATCH_PARENT;
        mImageParams.height = ViewGroup.LayoutParams.MATCH_PARENT;

        //初始化小点布局参数
        int size = mContext.getResources().getDimensionPixelSize(R.dimen.five_dp);
        mDotParams = new LinearLayout.LayoutParams(size, size);
        mDotParams.setMargins(5, 0, 5, 0);

        //初始化ViewPager布局参数
        mViewPagerParams = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);

        //初始化ViewPager
        mPagerAdapter = new MyPagerAdapter(mViewList);
        mViewPager = new ViewPager(mContext);
        mViewPager.setLayoutParams(mViewPagerParams);
        mViewPager.setAdapter(mPagerAdapter);
        mViewPager.addOnPageChangeListener(new MyPagerOnScrollChangeListener());

        //加载ViewPager
        addView(mViewPager);

        if (isShowDot) {
            int height = mContext.getResources().getDimensionPixelOffset(R.dimen.twenty_dp);
            mDotLayoutParams = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, height);
            mDotLayoutParams.gravity = Gravity.BOTTOM | Gravity.CENTER;

            mDotLayout = new LinearLayout(mContext);
            mDotLayout.setLayoutParams(mDotLayoutParams);
            mDotLayout.setOrientation(LinearLayout.HORIZONTAL);
            mDotLayout.setGravity(Gravity.CENTER);
            addView(mDotLayout);
        }

    }

    public void updateView(int position) {
        if (null != mDotLayout) {
            mDotLayout.removeAllViews();
        }

        if (null != mViewList) {
            int length = mDataList.size();
            int viewLength = mViewList.size();

            for (int i = 0; i < length; i++) {
                String imgUrl = mDataList.get(i);
                ImageView view;

                if (i < viewLength) {//取以前的View
                    view = (ImageView) mViewList.get(i);
                } else {//新增View
                    view = new ImageView(mContext);
                    view.setLayoutParams(mImageParams);
                    mViewList.add(view);
                }

                view.setScaleType(ImageView.ScaleType.CENTER_CROP);
                view.setOnClickListener(this);

                //初始化加载图片框架
                ImageLoaderConfiguration config = new ImageLoaderConfiguration.Builder(mContext)
                        .threadPriority(Thread.NORM_PRIORITY - 2)// 线程优先级
                        .denyCacheImageMultipleSizesInMemory()
                        .tasksProcessingOrder(QueueProcessingType.LIFO)
                        .memoryCache(new LruMemoryCache(3 * 1024 * 1024))
                        .memoryCacheSize(3 * 1024 * 1024)
                        .build();
                ImageLoader.getInstance().init(config);

                //下载图片--》这里可以替换成自己想要的加载图片工具
                ImageLoader.getInstance().displayImage(imgUrl, view);

                //添加小点视图
                if (isShowDot) {
                    ImageView dot = new ImageView(mContext);
                    dot.setImageResource(R.drawable.dot);
                    dot.setLayoutParams(mDotParams);

                    if (i == 0)
                        dot.setSelected(true);

                    mDotLayout.addView(dot);
                }

            }

            //控制ViewPager的滚动
            setCurrentItem(position);
            mPagerAdapter.notifyDataSetChanged();
            mRollHelper = new ViewPagerRollHelper(mViewPager, mPagerAdapter);
            mRollHelper.setAutoScroll(isAutoScroll);
            mRollHelper.autoScroll();
        }

    }

    public void setCurrentItem(int position) {
        mViewPager.setCurrentItem(position);
    }

    public int getCurrentItem() {
        return mViewPager.getCurrentItem();
    }

    @Override
    public void onClick(View v) {
    }

    //ViewPager适配器:加载图片
    private class MyPagerAdapter extends PagerAdapter {
        private List<View> viewList;

        public MyPagerAdapter(List<View> viewList) {
            this.viewList = viewList;
        }

        @Override
        public int getCount() {
            return viewList.size();
        }

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

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView(viewList.get(position));
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            View view = viewList.get(position);
            container.addView(view);
            return view;
        }
    }

    //页面滚动监听器:主要是为了控制小点的显示
    private class MyPagerOnScrollChangeListener implements ViewPager.OnPageChangeListener {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }

        @Override
        public void onPageSelected(int position) {
            mRollHelper.setPagerChangeEvent(position);
            if (isShowDot) {
                View view = mDotLayout.getChildAt(position);
                View befView = mDotLayout.getChildAt(mBofPosition);
                view.setSelected(true);
                befView.setSelected(false);
                mBofPosition = position;
            }
        }

        @Override
        public void onPageScrollStateChanged(int state) {
        }
    }

}

步骤四:添加辅助类

/**
 * Created by pengkv on 15/12/5.
 */
public class ViewPagerRollHelper {
    private ViewPager mViewPager = null;
    private PagerAdapter mPagerAdapter = null;
    private int newPosition, oldPosition, maxPosition;
    private boolean isAutoScroll = true;
    private static final int CHANGE_ADS = 0;//切换的参数
    private Timer mTimer = null;
    private MyTimertask myTimertask = null;

    public ViewPagerRollHelper(ViewPager viewPager, PagerAdapter pagerAdapter) {
        mViewPager = viewPager;
        mPagerAdapter = pagerAdapter;
    }

    //控制ViewPager的当前位置
    Handler handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what) {
                case CHANGE_ADS:
                    newPosition = (Integer) msg.obj;
                    mViewPager.setCurrentItem(newPosition);
                    break;
            }
        }
    };

    //自动滚动
    public void autoScroll() {
        //获取页面个数
        maxPosition = mPagerAdapter.getCount() - 1;

        if (isAutoScroll && maxPosition > 0) {
            if (mTimer != null) {
                mTimer.cancel();
                mTimer = null;
            }

            mTimer = new Timer();

            if (myTimertask != null) {
                myTimertask.cancel();
                myTimertask = null;
            }

            if (null == myTimertask)
                myTimertask = new MyTimertask();

            mTimer.schedule(myTimertask, 3000, 3000);
        }

    }

    //设置页面变更事件
    public void setPagerChangeEvent(int curIndex) {
        newPosition = curIndex;
        oldPosition = newPosition - 1;
        autoScroll();
    }

    //发送位置变更信息
    class MyTimertask extends TimerTask {

        @Override
        public void run() {
            if (newPosition >= 0 && newPosition < maxPosition) {//自动翻下一页
                newPosition += 1;
            } else if (newPosition == maxPosition) {//在最后一页
                newPosition = 0;
            }

            Message message = handler.obtainMessage();
            message.what = CHANGE_ADS;
            message.obj = newPosition;
            handler.sendMessage(message);
        }

    }

    public void setAutoScroll(boolean isAutoScroll) {
        this.isAutoScroll = isAutoScroll;
    }
}
时间: 2024-10-07 22:38:43

自动滚动的ViewPager的相关文章

Android自动滚动 轮播循环的ViewPager

主要介绍如何实现ViewPager自动播放,循环滚动的效果及使用.顺便解决ViewPager嵌套(ViewPager inside ViewPager)影响触摸滑动及ViewPager滑动速度设置问题. 项目已开源Android Auto Scroll [email protected],欢迎star和fork. 示例APK可从这些地址下载:Google Play,  360手机助手,  百度手机助手,  小米应用商店,  豌豆荚 示例代码地址见AutoScrollViewPagerDemo,效

Android开发之实现图片自动滚动显示标签的ViewPager

Android中实现图片自动滚动的效果非常的常见,我们可以自己动画去实现功能.但是在Android中提供了一个ViewPager类,实现了滚动效果,在Android的extras目录下android-support-vx.jar中,x代表版本4,7等等.使用时我们需要android.support.v4.view.ViewPager的viewPager标签. 博客来源:http://blog.csdn.net/fengshizty 代码非常的简单,不用解释: xml布局文件如下: <Relati

Android ViewPager 实现自动滚动效果

Android 中使用ViewPager 并实现自动滚动效果. 学习自:自己研究 OverView 我们在很多软件中都见过一下的效果,他的效果就是在在 APP的顶部会个自动滚动的View在滑动,那么我们看一下如何使用他吧. ViewPager的自动滚动效果 在 2019-12-27 日 我发过一篇 Android 中如何使用ViewPager的文章,如果你还不会ViewPager的基础使用,那么我觉得你可以去看一下.链接. 好了不多废话,我们看一下如何去实现ViewPager的自动滚动的效果.

图片自动滚动,循环播放Android auto-scroll-view-pager(转载)

详细可看: http://uisource.com/project/auto-scroll-view-pager/ 示例代码可看: https://github.com/Trinea/android-demo/blob/master/src/cn/trinea/android/demo/AutoScrollViewPagerDemo.java 使用: 1.引入library 2.调用: ①布局定义 <cn.trinea.android.view.autoscrollviewpager.AutoS

怎么停止LogCat的自动滚动?

============问题描述============ 真机调试时,想看看所有的调试消息,但是Logcat老是自动滚动,就是有新的调试消息时,就会自动向上滚动,把我现在看的滚没了,真是不胜其烦,但是又找不到关闭自动滚动的方法,啊啊啊,烦死了... ============解决方案1============ 在LogCat窗口右侧有一个+符号,新建Log Filter,设置好by Log Tag的值,这个值要与Log输出的Tag值一样,这样这个新建的窗口里面就只会显示你的Log了 =======

iOS中scrollview自动滚动的实现

http://bbs.csdn.net/topics/390347330 原问题是,我要展现给用户的内容放在scrollview中,让内容从上到底自动滚动,我最开始用的是DDAutoscrollview,但是无法实现. 一种解决方案见下边,更多解决方案见:http://ask.csdn.net/questions/374 .h文件 Objective C code ? 1 2 3 4 5 6 7 8 9  @interface Interface1 : UIViewController {   

delphi 自动滚动到最底端scroll

自动滚动到最底端scroll Uses MSHTML;{$R *.dfm}var  ScrollPos: integer=0;procedure TForm1.Button1Click(Sender: TObject);begin  inc(ScrollPos, 10);  if WebBrowser1.Document <> nil then    (WebBrowser1.Document as IHTMLDocument2).parentWindow.scroll(0,ScrollPos

解决Android中,禁止ScrollView内的控件改变之后自动滚动

问题: 最近在写一个程序界面,有一个scrollVIew,其中有一段内容是需要在线加载的. 当内容加载完成后,ScrollView中内容的长度会发生改变,这时ScrollView会自动下滚,如下图所示: 滚动的那一下体验特别不好,所以要防止这种情况.即不论Scrollview中内容如何,都要保持在最上. 解决办法: 先简单写一下我的xml文件的结构: [html] view plaincopy <ScrollView android:id="@+id/scrollView1" a

ios开发——实用技术篇&amp;图片无限滚动和自动滚动

初始化项目 1:自定义一个集成自Collection的Cell .h 1 #import <UIKit/UIKit.h> 2 @class iCocosNews; 3 @interface iCocosNewsCell : UICollectionViewCell 4 @property (nonatomic, strong) iCocosNews *news; 5 @end .m 1 #import "iCocosNewsCell.h" 2 #import "i