最近要做一個輪播圖的效果，網上看了幾篇文章，基本上都能找到實現，效果還挺不錯，但是在寫的時候感覺每次都要單獨去重新在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.ViewPager android: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()中獲取我們需要的控件
@Override protected 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 { @Override public int getCount() { return totalCount; } @Override public boolean isViewFromObject(View view, Object object) { return view==object; } @Override public Object isViewFromObject(ViewGroup container, int position) { position %= showCount; //調用接口的getView()獲取使用者要展示的View; View view = adapter.getView(position); container.addView(view); return view; } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView((View) object); } @Override public int getItemPosition(Object object) { return super.getItemPosition(object); } @Override public 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() { @Override public 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.CarouselView android: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軟件編程有所幫助。
新聞熱點
疑難解答
