前言
实际项目需要一个 播放广告的控件，可能有多个广告图片。每个一段时间更换该图片。简单来说，就是一个 “循环播放图片”的控件。
- 间隔时间更换图片
- 一般来说，图片切换时需要有动画效果
- 需要支持手势，用户开源滑动图片并移动，拨动到感兴趣的图片并查看。
- 在手势过程中不再自动循环播放，手势结束后再继续播放
我想到了使用ViewPager来实现，又有手势，又有动画。参考了网上了一些实现思路。尤其感谢这篇文章：http://www.cnblogs.com/xinye/archive/2013/06/09/3129140.html
开源库
我自己写一个自定义View，托管在gitHub。
名称：SimpleCycleViewPager
地址：https://github.com/vir56k/SimpleCycleViewPager
作者：张云飞
日期：2015-12-04 15:24:12
描述: 循环播放的 viewPager
适用: 某些需要 循环播放 广告，主题内容，活动，新闻内容时。
支持： 拖动手势拖动过程中 不滚动
实现思路
页面的循环思路
假如我们有两张图片： img1,和img2，我们可以创建两个页面。如下所示：
img1, img2
0, 1,
但是：如果我们仅仅 创建两个页面，就会发现滑到尽头就 无法滑动 了。
想无限的循环滑动，就需要：
1. 需要 img1 还能向左滑动，那么img1 的所在页面的左侧（前面）也需要 多放置一个页面
2. 需要 到达 img2 ,即到达最后一页时，还能向右滑动，那么，也需要再这个页面 右侧（后面）多放置一个页面
据此，那么 使用这两个图片，我们需要创建四个页面，如下所示：
img2, img1, img2, img1
0, 1, 2, 3
重要的一步：
注意上面的索引编号，当滑动到第0 页时，即第0页的滚动事件（后文解释）结束后，将第0页变成 第2页，由于 第0页和第2页是一模一样的，所以 视觉上感觉不到变化。
同理，当滚动到第3页（最后一页）时，我们将第3页换成第1页，由于 第3页和第1页是一模一样的，所以 视觉上感觉不到变化。
由此无限循环达成，即 一旦移动到头部，就切换到 倒数第二个。一旦到最后一个，就切换到第二个索引。
参考这篇文章：http://www.cnblogs.com/xinye/archive/2013/06/09/3129140.html
页面翻页的实现思路
我们需要了解viewPager的一些事件监听：
addOnPageChangeListener(mOnPageChangeListener);
这个方法添加一个监听器，用于监听 页面改变 。它的监听器的方法有：
void onPageSelected(int postion) 当页面被选中时发生。 这个第一步
void onPageScrollStateChanged 当页面滚动状态变化时发生。这是第二步 我们知道 onPageSelected 先于 onPageScrollStateChanged 发生。
1. 在onPageSelected时 判断当前索引，并计算出新的索引，如果是第0个，或者最后一个，就得到新的索引
2. 在onPageScrollStateChanged，时，切换索引。
间隔翻页的实现
使用 handler 的 sendMessageDelayed 间隔发送消息实现。 有了上面的逻辑，我们就让页面不断的间隔事件移动到下一个页面即可。由于实现了无限循环逻辑，这里就简单了。
实现代码：
package zhangyf.vir56k.autoviewpager; import android.app.Activity;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.os.Handler;
import android.os.Message;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView; import java.lang.ref.WeakReference;
import java.util.ArrayList;
import java.util.Date;
import java.util.List; /**
* 作者：张云飞
* 日期：2015-12-04 15:24:12
* name: 循环播放的 viewPager
* 适用: 某些需要 循环播放 广告，主题内容，活动，新闻内容时。
* 支持： 拖动手势拖动过程中 不滚动
* Created by zhangyunfei on 15/12/4.
*/
public class SimpleCycleViewPager extends ViewPager {
private static final String TAG = SimpleCycleViewPager.class.getSimpleName();
private long interval = 1500; private int currentPosition; private MyHandler myHandler;
private MyPagerAdapter pagerAdapter;
private DateLogger mDateLogger = new DateLogger();
private List<Drawable> mDatasource; public SimpleCycleViewPager(Context context) {
super(context);
init();
} public SimpleCycleViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
init();
} private void init() {
setOffscreenPageLimit(3);
addOnPageChangeListener(mOnPageChangeListener); myHandler = new MyHandler(this);
} public long getInterval() {
return interval;
} /**
* 自动滚动的间隔
*
* @param interval
*/
public void setInterval(long interval) {
this.interval = interval;
} public void setDatasource(List<Drawable> data) {
mDatasource = data;
if (mDatasource == null || mDatasource.size() == 1) {
setEnabled(false);
setClickable(false);
setFocusable(false);
setFocusableInTouchMode(false);
}
pagerAdapter = new MyPagerAdapter(data);
setAdapter(pagerAdapter); currentPosition = 1;
setCurrentItem(1);
} public void showNextView() {
if (mDatasource == null || mDatasource.size() == 1)
return;
setCurrentItem(currentPosition + 1, true);
} /**
* 子页面变化状态监听
*/
ViewPager.OnPageChangeListener mOnPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int positon, float baifen, int offset) {
} @Override
public void onPageSelected(int postion) {
Log.i(TAG, "## onPageSelected :: onPageSelected:" + postion);
if (pagerAdapter.getCount() == 0)
return;
currentPosition = postion;
if (postion == 0) {
int last = currentPosition;
currentPosition = pagerAdapter.getCount() - 2;
Log.i(TAG, String.format("#### onPageSelected :: change currentPosition :: from %s to %s ", last, currentPosition));
} else if (postion == pagerAdapter.getCount() - 1) {
int last = currentPosition;
currentPosition = 1;
Log.i(TAG, String.format("#### onPageSelected :: change currentPosition :: from %s to %s ", last, currentPosition));
}
} @Override
public void onPageScrollStateChanged(int state) {
Log.i(TAG, "## onPageScrollStateChanged :: state=" + state);
if (pagerAdapter.getCount() == 0)
return;
if (state == ViewPager.SCROLL_STATE_DRAGGING) {
pauseScroll();
} else if (state == ViewPager.SCROLL_STATE_IDLE) {
Log.i(TAG, "## onPageScrollStateChanged :: viewPager.getCurrentItem: " + getCurrentItem());
Log.i(TAG, "## onPageScrollStateChanged :: curent position: " + currentPosition);
setCurrentItem(currentPosition, false);
mDateLogger.logDate();
resumeScroll();
}
}
}; /**
* 恢复自动滚动
*/
public void resumeScroll() {
if (mDatasource == null || mDatasource.size() == 1)
return;
myHandler.sendMessageDelayed(myHandler.obtainMessage(MyHandler.MESSAGE_CHECK), interval);
} /**
* 暂停自动滚动
*/
public void pauseScroll() {
myHandler.removeMessages(MyHandler.MESSAGE_CHECK);
} private class MyPagerAdapter extends PagerAdapter { private final ArrayList<ImageView> viewList; public MyPagerAdapter(List<Drawable> data) {
if (data == null) {
viewList = new ArrayList<>();// 将要分页显示的View装入数组中
return;
}
viewList = new ArrayList<>();// 将要分页显示的View装入数组中 ImageView imageView; imageView = new ImageView(getContext());
imageView.setImageDrawable(data.get(data.size() - 1));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
viewList.add(imageView); for (int i = 0; i < data.size(); i++) {
imageView = new ImageView(getContext());
imageView.setImageDrawable(data.get(i));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
viewList.add(imageView);
} imageView = new ImageView(getContext());
imageView.setImageDrawable(data.get(0));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
viewList.add(imageView);
} @Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
} @Override
public int getCount() {
return viewList.size();
} @Override
public void destroyItem(ViewGroup container, int position,
Object object) {
container.removeView(viewList.get(position)); } @Override
public int getItemPosition(Object object) {
return POSITION_NONE;
} @Override
public CharSequence getPageTitle(int position) {
return "title" + position;
} @Override
public Object instantiateItem(ViewGroup container, int position) {
ViewGroup.LayoutParams lp = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
container.addView(viewList.get(position), lp);
return viewList.get(position);
} } private static class MyHandler extends Handler {
public static final int MESSAGE_CHECK = 9001;
private static final String TAG = MyHandler.class.getSimpleName();
private WeakReference<SimpleCycleViewPager> innerObject; public MyHandler(SimpleCycleViewPager context) {
this.innerObject = new WeakReference<>(context);
} @Override
public void handleMessage(Message msg) {
if (MESSAGE_CHECK == msg.what) {
SimpleCycleViewPager simpleCycleViewPager = innerObject.get();
if (simpleCycleViewPager == null)
return;
if (simpleCycleViewPager.getContext() instanceof Activity) {
Activity activity = (Activity) simpleCycleViewPager.getContext();
if (activity.isFinishing())
return;
}
simpleCycleViewPager.showNextView(); removeMessages(MESSAGE_CHECK);
sendMessageDelayed(obtainMessage(MESSAGE_CHECK), simpleCycleViewPager.interval);
return;
}
super.handleMessage(msg);
} } /**
* 记录时间间隔使用的 计时器
*/
private class DateLogger {
private long lastDate; public void logDate() {
long now = new Date().getTime();
if (lastDate == 0) {
lastDate = now;
return;
}
long jiange = now - lastDate;
Log.d(TAG, "时间间隔:" + jiange);
lastDate = now;
}
}
}
参考：
http://www.cnblogs.com/xinye/archive/2013/06/09/3129140.html