前言：经常会看到有一些app的banner界面可以实现循环播放多个广告图片和手动滑动循环。本以为单纯的ViewPager就可以实现这些功能。但是蛋疼的事情来了，ViewPager并不支持循环翻页。所以要实现循环还得需要自己去动手。自己在网上也找了些例子，本博文的Demo是结合自己找到的一些相关例子的基础上去改造，也希望对读者有用。
Demo实现的效果图如下：
Demo代码：
工程目录如下图：
废话不多说，上代码。
1.主Activity代码如下：
[java]view plaincopy packagecom.stevenhu.android.phone.ui;importjava.util.ArrayList;importjava.util.List;importcom.nostra13.universalimageloader.cache.disc.naming.Md5FileNameGenerator;importcom.nostra13.universalimageloader.core.DisplayImageOptions;importcom.nostra13.universalimageloader.core.ImageLoader;importcom.nostra13.universalimageloader.core.ImageLoaderConfiguration;importcom.nostra13.universalimageloader.core.assist.QueueProcessingType;importcom.stevenhu.android.phone.bean.ADInfo;importcom.stevenhu.android.phone.utils.ViewFactory;importandroid.annotation.SuppressLint;importandroid.app.Activity;importandroid.os.Bundle;importandroid.view.View;importandroid.widget.ImageView;importandroid.widget.Toast;importcn.androiddevelop.cycleviewpager.lib.CycleViewPager;importcn.androiddevelop.cycleviewpager.lib.CycleViewPager.ImageCycleViewListener;/***描述：主页**@authorstevenhu*@version5月8日上午10:47:37*/publicclassMainActivityextendsActivity{privateList<ImageView>views=newArrayList<ImageView>();privateList<ADInfo>infos=newArrayList<ADInfo>();privateCycleViewPagercycleViewPager;privateString[]imageUrls={"/v55183/infoimg/-07/13075322ky.jpg","/0626/8174275_085522448172_2.jpg","/1215/577405_080531548148_2.jpg","/0722/2912365_092519919000_2.jpg","/58pic/12/64/27/55U58PICrdX.jpg"};@OverrideprotectedvoidonCreate(BundlesavedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.ui_main);configImageLoader();initialize();}@SuppressLint("NewApi")privatevoidinitialize(){cycleViewPager=(CycleViewPager)getFragmentManager().findFragmentById(R.id.fragment_cycle_viewpager_content);for(inti=0;i<imageUrls.length;i++){ADInfoinfo=newADInfo();info.setUrl(imageUrls[i]);info.setContent("图片-->"+i);infos.add(info);}//将最后一个ImageView添加进来views.add(ViewFactory.getImageView(this,infos.get(infos.size()-1).getUrl()));for(inti=0;i<infos.size();i++){views.add(ViewFactory.getImageView(this,infos.get(i).getUrl()));}//将第一个ImageView添加进来views.add(ViewFactory.getImageView(this,infos.get(0).getUrl()));//设置循环，在调用setData方法前调用cycleViewPager.setCycle(true);//在加载数据前设置是否循环cycleViewPager.setData(views,infos,mAdCycleViewListener);//设置轮播cycleViewPager.setWheel(true);//设置轮播时间，默认5000mscycleViewPager.setTime(2000);//设置圆点指示图标组居中显示，默认靠右cycleViewPager.setIndicatorCenter();}privateImageCycleViewListenermAdCycleViewListener=newImageCycleViewListener(){@OverridepublicvoidonImageClick(ADInfoinfo,intposition,ViewimageView){if(cycleViewPager.isCycle()){position=position-1;Toast.makeText(MainActivity.this,"position-->"+info.getContent(),Toast.LENGTH_SHORT).show();}}};/***配置ImageLoder*/privatevoidconfigImageLoader(){//初始化ImageLoader@SuppressWarnings("deprecation")DisplayImageOptionsoptions=newDisplayImageOptions.Builder().showStubImage(R.drawable.icon_stub)//设置图片下载期间显示的图片.showImageForEmptyUri(R.drawable.icon_empty)//设置图片Uri为空或是错误的时候显示的图片.showImageOnFail(R.drawable.icon_error)//设置图片加载或解码过程中发生错误显示的图片.cacheInMemory(true)//设置下载的图片是否缓存在内存中.cacheOnDisc(true)//设置下载的图片是否缓存在SD卡中//.displayer(newRoundedBitmapDisplayer(20))//设置成圆角图片.build();//创建配置过得DisplayImageOption对象ImageLoaderConfigurationconfig=newImageLoaderConfiguration.Builder(getApplicationContext()).defaultDisplayImageOptions(options).threadPriority(Thread.NORM_PRIORITY-2).denyCacheImageMultipleSizesInMemory().discCacheFileNameGenerator(newMd5FileNameGenerator()).tasksProcessingOrder(QueueProcessingType.LIFO).build();ImageLoader.getInstance().init(config);}}
2.主文件ui_main.xml代码如下：[html]view plaincopy <?xmlversion="1.0"encoding="utf-8"?><LinearLayoutxmlns:android="/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><fragmentandroid:id="@+id/fragment_cycle_viewpager_content"android:name="cn.androiddevelop.cycleviewpager.lib.CycleViewPager"android:layout_width="match_parent"android:layout_height="180dip"/><RelativeLayoutandroid:layout_width="fill_parent"android:layout_height="0dip"android:layout_weight="1"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:text="content"/></RelativeLayout></LinearLayout>
3.CycleViewPager类代码如下：[java]view plaincopy packagecn.androiddevelop.cycleviewpager.lib;importjava.util.ArrayList;importjava.util.List;importandroid.annotation.SuppressLint;importandroid.app.Fragment;importandroid.os.Bundle;importandroid.os.Message;importandroid.support.v4.view.PagerAdapter;importandroid.support.v4.view.ViewPager.OnPageChangeListener;importandroid.view.LayoutInflater;importandroid.view.View;importandroid.view.View.OnClickListener;importandroid.view.ViewGroup;importandroid.widget.FrameLayout;importandroid.widget.ImageView;importandroid.widget.LinearLayout;importandroid.widget.RelativeLayout;importcom.stevenhu.android.phone.bean.ADInfo;importcom.stevenhu.android.phone.ui.R;/***实现可循环，可轮播的viewpager*/@SuppressLint("NewApi")publicclassCycleViewPagerextendsFragmentimplementsOnPageChangeListener{privateList<ImageView>imageViews=newArrayList<ImageView>();privateImageView[]indicators;privateFrameLayoutviewPagerFragmentLayout;privateLinearLayoutindicatorLayout;//指示器privateBaseViewPagerviewPager;privateBaseViewPagerparentViewPager;privateViewPagerAdapteradapter;privateCycleViewPagerHandlerhandler;privateinttime=5000;//默认轮播时间privateintcurrentPosition=0;//轮播当前位置privatebooleanisScrolling=false;//滚动框是否滚动着privatebooleanisCycle=false;//是否循环privatebooleanisWheel=false;//是否轮播privatelongreleaseTime=0;//手指松开、页面不滚动时间，防止手机松开后短时间进行切换privateintWHEEL=100;//转动privateintWHEEL_WAIT=101;//等待privateImageCycleViewListenermImageCycleViewListener;privateList<ADInfo>infos;@OverridepublicViewonCreateView(LayoutInflaterinflater,ViewGroupcontainer,BundlesavedInstanceState){Viewview=LayoutInflater.from(getActivity()).inflate(R.layout.view_cycle_viewpager_contet,null);viewPager=(BaseViewPager)view.findViewById(R.id.viewPager);indicatorLayout=(LinearLayout)view.findViewById(R.id.layout_viewpager_indicator);viewPagerFragmentLayout=(FrameLayout)view.findViewById(R.id.layout_viewager_content);handler=newCycleViewPagerHandler(getActivity()){@OverridepublicvoidhandleMessage(Messagemsg){super.handleMessage(msg);if(msg.what==WHEEL&&imageViews.size()!=0){if(!isScrolling){intmax=imageViews.size()+1;intposition=(currentPosition+1)%imageViews.size();viewPager.setCurrentItem(position,true);if(position==max){//最后一页时回到第一页viewPager.setCurrentItem(1,false);}}releaseTime=System.currentTimeMillis();handler.removeCallbacks(runnable);handler.postDelayed(runnable,time);return;}if(msg.what==WHEEL_WAIT&&imageViews.size()!=0){handler.removeCallbacks(runnable);handler.postDelayed(runnable,time);}}};returnview;}publicvoidsetData(List<ImageView>views,List<ADInfo>list,ImageCycleViewListenerlistener){setData(views,list,listener,0);}/***初始化viewpager**@paramviews*要显示的views*@paramshowPosition*默认显示位置*/publicvoidsetData(List<ImageView>views,List<ADInfo>list,ImageCycleViewListenerlistener,intshowPosition){mImageCycleViewListener=listener;infos=list;this.imageViews.clear();if(views.size()==0){viewPagerFragmentLayout.setVisibility(View.GONE);return;}for(ImageViewitem:views){this.imageViews.add(item);}intivSize=views.size();//设置指示器indicators=newImageView[ivSize];if(isCycle)indicators=newImageView[ivSize-2];indicatorLayout.removeAllViews();for(inti=0;i<indicators.length;i++){Viewview=LayoutInflater.from(getActivity()).inflate(R.layout.view_cycle_viewpager_indicator,null);indicators[i]=(ImageView)view.findViewById(R.id.image_indicator);indicatorLayout.addView(view);}adapter=newViewPagerAdapter();//默认指向第一项，下方viewPager.setCurrentItem将触发重新计算指示器指向setIndicator(0);viewPager.setOffscreenPageLimit(3);viewPager.setOnPageChangeListener(this);viewPager.setAdapter(adapter);if(showPosition<0||showPosition>=views.size())showPosition=0;if(isCycle){showPosition=showPosition+1;}viewPager.setCurrentItem(showPosition);}/***设置指示器居中，默认指示器在右方*/publicvoidsetIndicatorCenter(){RelativeLayout.LayoutParamsparams=newRelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT,RelativeLayout.LayoutParams.WRAP_CONTENT);params.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);params.addRule(RelativeLayout.CENTER_HORIZONTAL);indicatorLayout.setLayoutParams(params);}/***是否循环，默认不开启，开启前，请将views的最前面与最后面各加入一个视图，用于循环**@paramisCycle*是否循环*/publicvoidsetCycle(booleanisCycle){this.isCycle=isCycle;}/***是否处于循环状态**@return*/publicbooleanisCycle(){returnisCycle;}/***设置是否轮播，默认不轮播,轮播一定是循环的**@paramisWheel*/publicvoidsetWheel(booleanisWheel){this.isWheel=isWheel;isCycle=true;if(isWheel){handler.postDelayed(runnable,time);}}/***是否处于轮播状态**@return*/publicbooleanisWheel(){returnisWheel;}finalRunnablerunnable=newRunnable(){@Overridepublicvoidrun(){if(getActivity()!=null&&!getActivity().isFinishing()&&isWheel){longnow=System.currentTimeMillis();//检测上一次滑动时间与本次之间是否有触击(手滑动)操作，有的话等待下次轮播if(now-releaseTime>time-500){handler.sendEmptyMessage(WHEEL);}else{handler.sendEmptyMessage(WHEEL_WAIT);}}}};/***释放指示器高度，可能由于之前指示器被限制了高度，此处释放*/publicvoidreleaseHeight(){getView().getLayoutParams().height=RelativeLayout.LayoutParams.MATCH_PARENT;refreshData();}/***设置轮播暂停时间，即没多少秒切换到下一张视图.默认5000ms**@paramtime*毫秒为单位*/publicvoidsetTime(inttime){this.time=time;}/***刷新数据，当外部视图更新后，通知刷新数据*/publicvoidrefreshData(){if(adapter!=null)adapter.notifyDataSetChanged();}/***隐藏CycleViewPager*/publicvoidhide(){viewPagerFragmentLayout.setVisibility(View.GONE);}/***返回内置的viewpager**@returnviewPager*/publicBaseViewPagergetViewPager(){returnviewPager;}/***页面适配器返回对应的view**@authorYuedongLi**/privateclassViewPagerAdapterextendsPagerAdapter{@OverridepublicintgetCount(){returnimageViews.size();}@OverridepublicbooleanisViewFromObject(Viewarg0,Objectarg1){returnarg0==arg1;}@OverridepublicvoiddestroyItem(ViewGroupcontainer,intposition,Objectobject){container.removeView((View)object);}@OverridepublicViewinstantiateItem(ViewGroupcontainer,finalintposition){ImageViewv=imageViews.get(position);if(mImageCycleViewListener!=null){v.setOnClickListener(newOnClickListener(){@OverridepublicvoidonClick(Viewv){mImageCycleViewListener.onImageClick(infos.get(currentPosition-1),currentPosition,v);}});}container.addView(v);returnv;}@OverridepublicintgetItemPosition(Objectobject){returnPOSITION_NONE;}}@OverridepublicvoidonPageScrollStateChanged(intarg0){if(arg0==1){//viewPager在滚动isScrolling=true;return;}elseif(arg0==0){//viewPager滚动结束if(parentViewPager!=null)parentViewPager.setScrollable(true);releaseTime=System.currentTimeMillis();viewPager.setCurrentItem(currentPosition,false);}isScrolling=false;}@OverridepublicvoidonPageScrolled(intarg0,floatarg1,intarg2){}@OverridepublicvoidonPageSelected(intarg0){intmax=imageViews.size()-1;intposition=arg0;currentPosition=arg0;if(isCycle){if(arg0==0){currentPosition=max-1;}elseif(arg0==max){currentPosition=1;}position=currentPosition-1;}setIndicator(position);}/***设置viewpager是否可以滚动**@paramenable*/publicvoidsetScrollable(booleanenable){viewPager.setScrollable(enable);}/***返回当前位置,循环时需要注意返回的position包含之前在views最前方与最后方加入的视图，即当前页面试图在views集合的位置**@return*/publicintgetCurrentPostion(){returncurrentPosition;}/***设置指示器**@paramselectedPosition*默认指示器位置*/privatevoidsetIndicator(intselectedPosition){for(inti=0;i<indicators.length;i++){indicators[i].setBackgroundResource(R.drawable.icon_point);}if(indicators.length>selectedPosition)indicators[selectedPosition].setBackgroundResource(R.drawable.icon_point_pre);}/***如果当前页面嵌套在另一个viewPager中，为了在进行滚动时阻断父ViewPager滚动，可以阻止父ViewPager滑动事件*父ViewPager需要实现ParentViewPager中的setScrollable方法*/publicvoiddisableParentViewPagerTouchEvent(BaseViewPagerparentViewPager){if(parentViewPager!=null)parentViewPager.setScrollable(false);}/***轮播控件的监听事件**@authorminking*/publicstaticinterfaceImageCycleViewListener{/***单击图片事件**@paramposition*@paramimageView*/publicvoidonImageClick(ADInfoinfo,intpostion,ViewimageView);}} CycleViewPager类为实现可循环，可轮播的ViewPager的核心类，继承自Fragment，具体实现原理就不多说了，代码中都有相关的注释。
ok，接下来的其他类就不多说了。自己下载Demo学习吧。
本博文Demo下载链接地址如下：
/detail/stevenhu_223/8675717
另外，还有一种通过自定义ViewPager实现和本博文相同效果的广告界面Demo，这里就不再贴代码，可以通过如下地址下载：
/detail/stevenhu_223/8697903
