android使用ViewPager实现画廊效果

参考http://blog.youkuaiyun.com/xiaanming/article/details/8966621#reply多了自动滑动页面。
本例子实现了用ViewPager代替画廊grallery。
实现了图片的左右滑动和添加了定时滑动。

上代码

package com.example.galleryviewpager;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;
import android.widget.LinearLayout;

public class MainActivity extends Activity implements OnPageChangeListener {
    private ViewPager viewPager;
    private List<ImageView> imageViews; // 滑动的图片集合
    private List<ImageView> dots; // 图片标题正文的那些点
    private int[] imgIdArray;// 图片资源id
    private int currentItem = 0; // 当前图片的索引号
    private Handler handler = new Handler();
    private Runnable runnable = new Runnable() {
        @Override
        public void run() {
            synchronized (viewPager) {
                currentItem = currentItem + 1;
                viewPager.setCurrentItem(currentItem);// 切换当前显示的图片
            }
            handler.postDelayed(runnable, 4000);
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ViewGroup group = (ViewGroup) findViewById(R.id.viewGroup);
        viewPager = (ViewPager) findViewById(R.id.viewPager);

        // 载入图片资源ID
        imgIdArray = new int[] { R.drawable.item01, R.drawable.item02,
                R.drawable.item03, R.drawable.item04, R.drawable.item05,
                R.drawable.item06, R.drawable.item07, R.drawable.item08 };

        imageViews = new ArrayList<ImageView>();
        // 初始化图片资源
        if (imgIdArray != null && imgIdArray.length > 0) {
            if (imgIdArray.length == 1) {
                for (int i = 0; i < (imgIdArray.length * 2); i++) {
                    ImageView imageView = new ImageView(this);
                    imageView.setImageResource(imgIdArray[0]);
                    imageView.setScaleType(ScaleType.CENTER_CROP);
                    imageViews.add(imageView);

                }
                group.setVisibility(View.GONE);
                viewPager.setOnTouchListener(new View.OnTouchListener() {

                    @Override
                    public boolean onTouch(View arg0, MotionEvent arg1) {
                        return true;
                    }
                });
            } else if (imgIdArray.length == 2 || imgIdArray.length == 3) {
                for (int i = 0; i < (imgIdArray.length * 2); i++) {
                    ImageView imageView = new ImageView(this);
                    imageView
                            .setImageResource(imgIdArray[(i > (imgIdArray.length - 1)) ? i
                                    - imgIdArray.length
                                    : i]);
                    imageView.setScaleType(ScaleType.CENTER_CROP);
                    imageViews.add(imageView);
                }
            } else {
                for (int i = 0; i < imgIdArray.length; i++) {
                    ImageView imageView = new ImageView(this);
                    imageView.setImageResource(imgIdArray[i]);
                    imageView.setScaleType(ScaleType.CENTER_CROP);
                    imageViews.add(imageView);
                }
            }

            // 将点点加入到ViewGroup中
            dots = new ArrayList<ImageView>();
            for (int i = 0; i < imgIdArray.length; i++) {
                ImageView imageView = new ImageView(this);
                // 控制点间距离
                LinearLayout.LayoutParams ll = new LinearLayout.LayoutParams(
                        LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
                ll.setMargins(5, 0, 5, 0);
                imageView.setLayoutParams(ll);
                dots.add(imageView);
                if (i == 0) {
                    dots.get(i).setBackgroundResource(
                            R.drawable.page_indicator_focused);
                } else {
                    dots.get(i).setBackgroundResource(
                            R.drawable.page_indicator_unfocused);
                }

                group.addView(imageView);
            }

            // 设置Adapter
            viewPager.setAdapter(new MyAdapter());
            // 设置监听，主要是设置点点的背景
            viewPager.setOnPageChangeListener(this);
            // 设置ViewPager的默认项, 设置为长度的100倍，这样子开始就能往左滑动
            viewPager.setCurrentItem((imageViews.size()) * 10);
        }
    }

    @Override
    protected void onResume() {
        if (imgIdArray != null && imgIdArray.length > 0) {
            if (imgIdArray.length != 1) {
                handler.postDelayed(runnable, 4000);
            }
        }
        super.onResume();
    }

    @Override
    protected void onPause() {
        handler.removeCallbacks(runnable);
        super.onPause();
    }

    public class MyAdapter extends PagerAdapter {

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

        @Override
        public boolean isViewFromObject(View arg0, Object arg1) {
            return arg0 == arg1;
        }

        // 当只有3张图片或者2张图片的时候，滑动存在BUG问题(滑动时有白屏)的修改如下
        // destroyItem(View container, int position, Object
        // object)方法中不removeView
        @Override
        public void destroyItem(View container, int position, Object object) {
            if (imageViews.size() == 2 || imageViews.size() == 3) {

            } else {
                ((ViewPager) container).removeView(imageViews.get(position
                        % imageViews.size()));
            }
        }

        /**
         * 载入图片进去，用当前的position 除以 图片数组长度取余数是关键
         */
        @Override
        public Object instantiateItem(View container, int position) {
            try {
                ((ViewPager) container).addView(
                        imageViews.get(position % imageViews.size()), 0);
            } catch (Exception e) {
                // handler something
            }
            return imageViews.get(position % imageViews.size());
        }

    }

    @Override
    public void onPageScrollStateChanged(int arg0) {

    }

    @Override
    public void onPageScrolled(int arg0, float arg1, int arg2) {

    }

    @Override
    public void onPageSelected(int arg0) {
        currentItem = arg0;
        if (imgIdArray != null && imgIdArray.length > 0) {
            if (imgIdArray.length <= 3) {
                setImageBackground(arg0 % (imageViews.size() / 2));
            } else {
                setImageBackground(arg0 % imageViews.size());
            }
        }
    }

    /**
     * 设置选中的tip的背景
     * 
     * @param selectItems
     */
    private void setImageBackground(int selectItems) {

        for (int i = 0; i < dots.size(); i++) {
            if (i == selectItems) {
                dots.get(i).setBackgroundResource(
                        R.drawable.page_indicator_focused);
            } else {
                dots.get(i).setBackgroundResource(
                        R.drawable.page_indicator_unfocused);
            }
        }
    }

}

activity_main.xml文件

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

   <android.support.v4.view.ViewPager  
        android:id="@+id/viewPager"  
        android:layout_width="fill_parent"  
        android:layout_height="wrap_content" /> 

    <RelativeLayout  
        android:layout_width="fill_parent"  
        android:layout_height="wrap_content" 
        android:orientation="vertical" >  

        <LinearLayout  
            android:id="@+id/viewGroup"  
            android:layout_width="fill_parent"  
            android:layout_height="wrap_content"  
            android:layout_alignParentBottom="true" 
            android:layout_marginBottom="30dp"  
            android:gravity="center_horizontal"  
            android:orientation="horizontal" >  
        </LinearLayout>  
    </RelativeLayout>  

</FrameLayout>

源码下载：
http://download.youkuaiyun.com/detail/hjqjl/9394851