Android滑动展示图片（一页多图，带小圆点，类似小米市场APP详情页图片展示）

最近公司需求上有个功能，类似小米市场上APP详情页里的图片展示效果，有点像广告位的展示，只是广告位一般都是展示一张，这个要求一个屏幕展示多张，想了一下用ViewPager的话一方面需要控制最后一张图防止拉出空白，另一方面感觉滑动不是很流畅，这个方案就被pass了。最后综合考虑一下就用RecyclerView实现了此功能。先放图大家看看是啥功能吧。

其实只需自定义RecyclerView就可以了，代码贴出如下。

package com.maxi.myrecyclerview.widget;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.RecyclerView.OnScrollListener;
import android.util.AttributeSet;
import android.view.View;

public class MyRecyclerView extends RecyclerView implements OnScrollListener {

	/**
	 * 当向右滑时记录第一个View 向左滑时记录当前屏幕最后一个View(也就是第二个View)
	 */
	private View mRecordView;

	private OnItemScrollChangeListener mItemScrollChangeListener;

	public void setOnItemScrollChangeListener(
			OnItemScrollChangeListener mItemScrollChangeListener) {
		this.mItemScrollChangeListener = mItemScrollChangeListener;
	}

	public interface OnItemScrollChangeListener {
		void onChange(View view, int position);
	}

	public MyRecyclerView(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
		this.setOnScrollListener(this);
	}

	@Override
	protected void onLayout(boolean changed, int l, int t, int r, int b) {
		super.onLayout(changed, l, t, r, b);
		mRecordView = getChildAt(0);
		if (mItemScrollChangeListener != null) {
			mItemScrollChangeListener.onChange(mRecordView,
					getChildPosition(mRecordView));
		}
	}

	@Override
	public void onScrollStateChanged(int arg0) {
	}
	@Override
	public void onScrolled(int arg0, int arg1) {
		View newView = null;
		if (arg0 > 1) {				//向右滑动
			newView = getChildAt(1);		//记录第二个View也就是当前屏幕最后一个
		} else if (arg0 < -1) {		//向左滑动
			newView = getChildAt(0);	//记录第一个View也就是当前屏幕第一个
		}
		if (mItemScrollChangeListener != null) {
			if (newView != null && newView != mRecordView) {
				mRecordView = newView;
				mItemScrollChangeListener.onChange(mRecordView,
						getChildPosition(mRecordView));
			}
		}
	}
}

通过判断mRecordView的变化判断小圆点的显示，然后看一下调用方法：

package com.maxi.myrecyclerview;

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

import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.view.View;
import android.view.ViewGroup.LayoutParams;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;
import android.widget.LinearLayout;
import android.widget.Toast;

import com.maxi.myrecyclerview.adapter.GalleryAdapter;
import com.maxi.myrecyclerview.adapter.GalleryAdapter.OnItemClickListener;
import com.maxi.myrecyclerview.widget.MyRecyclerView;
import com.maxi.myrecyclerview.widget.MyRecyclerView.OnItemScrollChangeListener;

public class MainActivity extends Activity {
	private MyRecyclerView mRecyclerView;
	private GalleryAdapter mAdapter;
	private List<Integer> mDatas;
	private LinearLayout dotContain;
	private List<ImageView> dotViews = new ArrayList<ImageView>();

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		mRecyclerView = (MyRecyclerView) findViewById(R.id.id_recyclerview_horizontal);
		dotContain = (LinearLayout) findViewById(R.id.dot_contain);
		initDatas();
		initDot();
		LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
		linearLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
		mRecyclerView.setLayoutManager(linearLayoutManager);
		mAdapter = new GalleryAdapter(this, mDatas);
		mAdapter.setOnItemClickListener(new OnItemClickListener() {

			@Override
			public void onItemClick(View view, int position) {
				// TODO Auto-generated method stub
				Toast.makeText(MainActivity.this, position + "",
						Toast.LENGTH_SHORT).show();
			}

		});
		mRecyclerView.setAdapter(mAdapter);
		/*
		 * 当前记录View的变化，用来判断小圆点的显示
		 */
		mRecyclerView
				.setOnItemScrollChangeListener(new OnItemScrollChangeListener() {

					@Override
					public void onChange(View view, int position) {
						// TODO Auto-generated method stub
							for (int i = 0; i < dotViews.size(); i++) {
								if (position == i) {
									dotViews.get(i).setBackgroundResource(
											R.drawable.point_read);
								} else {
									dotViews.get(i).setBackgroundResource(
											R.drawable.point_normal);
								}
							}
					}

				});
	}

	private void initDatas() {
		mDatas = new ArrayList<Integer>(Arrays.asList(R.drawable.a1,
				R.drawable.a2, R.drawable.a3, R.drawable.a4, R.drawable.a5));
	}

	private void initDot() {
		for (int i = 0; i < mDatas.size(); i++) {
			LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
					LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
			layoutParams.setMargins(0, 0, 10, 0);
			ImageView dotView = new ImageView(this);
			if (i == 0) {
				// 默认选中第一张图片
				dotView.setBackgroundResource(R.drawable.point_read);
			} else {
				// 其他图片都设置未选中状态
				dotView.setBackgroundResource(R.drawable.point_normal);
			}
			dotView.setLayoutParams(layoutParams);
			dotView.setScaleType(ScaleType.FIT_XY);
			dotViews.add(dotView);
			dotContain.addView(dotView);
		}
	}
}

通过回调传值，获取到当前View的下标position，然后根据它来显示小圆点。

因为发现怎么搜都搜不到类似的源码，所以自己写了一下发上来，希望以后如果需要这种功能的人能做一下参考。（呵呵，估计这种功能很少人需要吧）有更好的建议或意见都留留言哈，共同进步啊！

有疑问或者更好地实现方式的话 请加QQ群：135451435。共同进步！