Android自定义控件实现简单的轮播图控件

最近要做一个轮播图的效果，网上看了几篇文章，基本上都能找到实现，效果还挺不错，但是在写的时候感觉每次都要单独去重新在Activity里写一堆代码。于是自己封装了一下。本篇轮播图实现原理原文出处：循环广告位组件的实现，这里只是做了下封装成一个控件，不必每次重复写代码了。
效果图：

实现分析
轮播图的功能就是实现左右滑动的广告、图片信息展示，那我们就用ViewPager来实现，由于考虑到用户体验，我们还需要在下面加一个指示器来标示滑动到了第几张轮播图。指示器我们可以用一个线性布局来根据要展示的轮播图设置显示的View,我们要做这样的一个控件没有什么特殊的效果，其实就是两个控件的组合，只是我们要在内部处理好它们之间的交互关系（其实就是ViewPager滚动的时候，下面指示器的展示），所以我们就用自定义控件当中的组合方式来实现。
下面开始
1、定义一个控件继承FrameLayout,写一个xml文件

public class CarouselView extends FrameLayout implements ViewPager.OnPageChangeListener {private Context context;private int totalCount =100;//总数，这是为实现无限滑动设置的private int showCount;//要显示的轮播图数量private int currentPosition =0;//当前ViewPager的位置private ViewPager viewPager;private LinearLayout carouselLayout;//展示指示器的布局private Adapter adapter;private int pageItemWidth;//每个指示器的宽度private boolean isUserTouched = false;public CarouselView（Context context） {super（context）;this.context = context;}public CarouselView（Context context, AttributeSet attrs） {super（context, attrs）;this.context = context;}public CarouselView（Context context, AttributeSet attrs, int defStyleAttr） {super（context, attrs, defStyleAttr）;this.context = context;}<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><android.support.v4.view.ViewPagerandroid:id="@+id/gallery"android:layout_width="match_parent"android:layout_height="match_parent"android:unselectedAlpha="1"></android.support.v4.view.ViewPager><LinearLayout android:layout_height="wrap_content"android:layout_width="fill_parent"android:orientation="horizontal"android:gravity="center"android:layout_gravity="center|bottom"android:id="@+id/CarouselLayoutPage"android:padding="10dip"></LinearLayout></FrameLayout>

上面的代码把两个要用到的控件ViewPager和carouselLayout都包含在定义的CarouselView里面了，下面就是要获取
2、onFinishInflate（）中获取我们需要的控件

@Overrideprotected void onFinishInflate（） {super.onFinishInflate（）;View view = LayoutInflater.from（context）.inflate（R.layout.carousel_layout,null）;this.viewPager = （ViewPager） view.findViewById（R.id.gallery）;this.carouselLayout = （LinearLayout）view.findViewById（R.id.CarouselLayoutPage）;pageItemWidth = ConvertUtils.dip2px（context,5）;this.viewPager.addOnPageChangeListener（this）;addView（view）;}

onFinishInflate（）方法是自定义控件中常用的一个方法，它表示从XML加载组件完成了，在该方法中我们通过LayoutInflater.from（context）.inflate 获取到个ViewPager对象和carouselLayout对象，并对pageItemWidth进行了赋值。
同时为viewPager设置addOnPageChangeListener。这里别忘记调用addView（）;否则控件就展示不了啦！
3、通过设置set方法来获取数据，同时初始化界面效果
到这一步我们已经获取到了展示轮播图的ViewPager对象，那接下来要让它展示你肯定想到了写个类继承PagerAdapter，然后重写getCount，isViewFromObject，isViewFromObject，destroyItem等方法来让ViewPager展示轮播图。但是我们又不能写得太固定，因为可能每个人想要展示的数据不一样，所以我们定义一个接口来给外部使用的人写自己的逻辑。上代码：

//定义一个接口让外部设置展示的Viewpublic interface Adapter{boolean isEmpty（）;View getView（int position）;int getCount（）;}//ViewPager的适配器class ViewPagerAdapter extends PagerAdapter {@Overridepublic int getCount（） {return totalCount;}@Overridepublic boolean isViewFromObject（View view, Object object） {return view==object;}@Overridepublic Object isViewFromObject（ViewGroup container, int position） {position %= showCount;//调用接口的getView（）获取使用者要展示的View;View view = adapter.getView（position）;container.addView（view）;return view;}@Overridepublic void destroyItem（ViewGroup container, int position, Object object） {container.removeView（（View） object）;}@Overridepublic int getItemPosition（Object object） {return super.getItemPosition（object）;}@Overridepublic void finishUpdate（ViewGroup container） {super.finishUpdate（container）;int position = viewPager.getCurrentItem（）;//实现Viewpager到第一页的实现能向左滑动if （position==0）{position=showCount;viewPager.setCurrentItem（position,false）;}else if （position==totalCount-1）{//ViewPager到最后一页的实现向又滑动position = showCount - 1;viewPager.setCurrentItem（position,false）;}}}//为外部提供设置数据源的方法,同时为ViewPager做展示public void setAdapter（Adapter adapter）{this.adapter = adapter;if （adapter！=null）{init（）;}}

上面的代码就是定义了一个接口让外部来设置数据，提供setAdapter来为adapter赋值，同时初始化界面效果，init（）方法中就是数据的初始化，代码如下：

private void init（） {viewPager.setAdapter（null）;carouselLayout.removeAllViews（）;//清空之前的数据if （adapter.isEmpty（））{return;}int count = adapter.getCount（）;showCount = adapter.getCount（）;for （int i=0;i<count;i++）{View view = new View（context）;//用来做指示器的View,通过state来做展示效果if （currentPosition==i）{view.setPressed（true）;LinearLayout.LayoutParams params = new LinearLayout.LayoutParams（pageItemWidth + ConvertUtils.dip2px（context,3）,pageItemWidth + ConvertUtils.dip2px（context,3））;params.setMargins（pageItemWidth, 0, 0, 0）;view.setLayoutParams（params）;}else {LinearLayout.LayoutParams params = new LinearLayout.LayoutParams（pageItemWidth,pageItemWidth）;params.setMargins（pageItemWidth,0,0,0）;view.setLayoutParams（params）;}view.setBackgroundResource（R.drawable.carousel_layout_page）;carouselLayout.addView（view）;}viewPager.setAdapter（new ViewPagerAdapter（））;viewPager.setCurrentItem（0）;//让手指触碰到的时候自动轮播不起效this.viewPager.setOnTouchListener（new OnTouchListener（） {@Overridepublic boolean onTouch（View v, MotionEvent event） {switch （event.getAction（））{case MotionEvent.ACTION_DOWN:case MotionEvent.ACTION_MOVE:isUserTouched = true;break;case MotionEvent.ACTION_UP:isUserTouched = false;break;}return false;}}）;mTimer.schedule（mTimerTask, 3000, 3000）;}

主要的逻辑代码就是这样啦，一个轮播图的控件就做好了。下面来看一下使用：
4、使用
xml中写我们的轮播图控件:

<com.yangqiangyu.test.carouselview.CarouselViewandroid:layout_width="match_parent"android:layout_height="220dp"> </com.yangqiangyu.test.carouselview.CarouselView>

java代码中获取控件，同时设置接口

 CarouselView carouselView = （CarouselView） findViewById（R.id.CarouselView）;carouselView.setAdapter（new CarouselView.Adapter（） { @Override public boolean isEmpty（） {return false; } @Override public View getView（int position） {View view = mInflater.inflate（R.layout.item,null）;ImageView imageView = （ImageView） view.findViewById（R.id.image）;imageView.setImageResource（mImagesSrc[position]）;return view; } @Override public int getCount（） {return mImagesSrc.length; }}）;

返回是否为空，在getView（int position）中return我们想返回的View，就是这么简单了啦。
希望本文所述对大家学习Android软件编程有所帮助。