实现简单易用的图片轮播器



图片轮播器在很多App中都有，它有如下几个步骤：

1.手势切换，用ViewPager实现。

ViewPager的布局文件如下，它作为ListView的Header放在头部，布局中的LinearLayout是自定义指示器的容器，可在代码中动态添加

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    
    <android.support.v4.view.ViewPager
        android:layout_alignParentTop="true"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:id="@+id/viewpager"
        />
    <LinearLayout
        android:id="@+id/index"
        android:orientation="horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_alignBottom="@+id/viewpager"
        android:padding="8dp">
    </LinearLayout>
    
</RelativeLayout>

2.自定义指示器

根据轮播图片的数量，初始化index的控件，自定义指示器会跟随切换而改变状态。

 for (int i = 0;i<url.length ; ++i) {

            ImageView image02 = new ImageView(this);
            image02.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
            image02.setPadding(5, 5, 0, 0);
            image02.setImageResource(R.drawable.circle_selector);
            image02.setSelected(0 == i ? true : false);
            index.addView(image02);
        }

3.无限循环，从最后一张到第一张图片的切换平滑过度且是同一个方向切换。

要实现可以左右循环滑动，首先需在ViewPager的适配器中把getCount方法返回的数量值设置为一个非常大的值，需要注意的是在根据position的值加载图片时先要对图片数量取余才能准确得到图片的URL地址，这里用的都是网络图片。

public class ViewPagerAdapter extends PagerAdapter {

    private Context context;
    private String url[];
    private DisplayImageOptions options;

    public ViewPagerAdapter(Context context,String url[]) {

        this.context=context;
        this.url=url;

        ImageLoaderConfiguration configuration = new ImageLoaderConfiguration.Builder(context)
                .threadPriority(3)
                .denyCacheImageMultipleSizesInMemory()
                .diskCacheFileNameGenerator(new Md5FileNameGenerator())
                .tasksProcessingOrder(QueueProcessingType.LIFO)
                .diskCacheSize(10 * 1024 * 1024)
                .writeDebugLogs()
                .build();
        ImageLoader.getInstance().init(configuration);

        options=new DisplayImageOptions.Builder()
                .cacheInMemory(true)
                .cacheOnDisk(true)
                .imageScaleType(ImageScaleType.IN_SAMPLE_POWER_OF_2)
                .bitmapConfig(Bitmap.Config.RGB_565)
                .build();
    }

    @Override
    public int getCount() {
        return Integer.MAX_VALUE;
    }

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

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        ImageView imageView=new ImageView(context);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        ImageLoader.getInstance().displayImage(url[position%url.length], imageView, options);
        container.addView(imageView);
        return imageView;
    }

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

实现手势切换Activity需要实现OnPageChangeListener这个接口，有三个方法要实现，这里同样是要对position进行处理

    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    @Override
    public void onPageSelected(int position) {

        //加上这句可以在手动切换时和自动切换不冲突
        currentIndex=position;

        for (int i=0;i<url.length;i++){
            if (i==position%url.length){
                index.getChildAt(i).setSelected(true);
            }else {
                index.getChildAt(i).setSelected(false);
            }
        }
    }
    
    @Override
    public void onPageScrollStateChanged(int state) {

    }

自动切换要用到定时器，java中Timer在JDK1.5后已经不常用了，这里用ScheduledExecutorService这个方法，用起来非常简单在生命周期函数onStart中启动，在onStop中关闭

 @Override
    protected void onStart() {
        super.onStart();
        executorService= Executors.newSingleThreadScheduledExecutor();
        executorService.scheduleAtFixedRate(new ScrollTask(),3L,3L, TimeUnit.SECONDS);
    }

    @Override
    protected void onStop() {
        super.onStop();

        if (executorService!=null)
            executorService.shutdown();
    }

scheduleAtFixedRate中有4个参数，第一个是继承Runable的线程方法，第二个是开始几秒后执行，第三个参数是执行间隔，最后一个是时间单位。方法如下：

private class ScrollTask implements Runnable{
        @Override
        public void run() {
            synchronized (headerLayout){
                currentIndex++;
                handler.sendEmptyMessage(0x123);
            }
        }
    }

在handler中接收到消息后就会根据currentIndex值切换ViewPager的显示了，handler方法如下

private Handler handler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            switch (msg.what){
                case 0x123:
                    viewPager.setCurrentItem(currentIndex);
                    break;
                default:
                    break;
            }

        }
    };

最后效果是这样的，gif录制效果有点渣：

源码地址http://download.csdn.net/detail/hzmhzm123/9127057