Android利用ViewPager实现可滑动放大缩小画廊效果

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <!-- 布局中添加自定义控件--> <com.mahao.alex.customviewdemo.viewpager.CoverFlowViewPager android:id="@+id/cover" android:layout_width="match_parent" android:layout_height="wrap_content" /></RelativeLayout>

public class MainActivity extends AppCompatActivity { private CoverFlowViewPager mCover; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mCover = (CoverFlowViewPager) findViewById(R.id.cover); // 初始化数据 List<View> list = new ArrayList<>(); for(int i = 0;i<10;i++){  ImageView img = new ImageView(this);  img.setBackgroundColor(Color.parseColor("#"+getRandColorCode()));  list.add(img); } //设置显示的数据 mCover.setViewList(list); // 设置滑动的监听，该监听为当前页面滑动到中央时的索引 mCover.setOnPageSelectListener(new OnPageSelectListener() {  @Override  public void select(int position) {  Toast.makeText(getApplicationContext(),position+"",Toast.LENGTH_SHORT).show();  } }); } /** * 获取随机颜色，便于区分 * @return */ public static String getRandColorCode(){ String r,g,b; Random random = new Random(); r = Integer.toHexString(random.nextInt(256)).toUpperCase(); g = Integer.toHexString(random.nextInt(256)).toUpperCase(); b = Integer.toHexString(random.nextInt(256)).toUpperCase(); r = r.length()==1 ? "0" + r : r ; g = g.length()==1 ? "0" + g : g ; b = b.length()==1 ? "0" + b : b ; return r+g+b; }}

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:clipChildren="false"> <android.support.v4.view.ViewPager android:id="@+id/vp_conver_flow" android:layout_width="180dp" android:layout_height="260dp" android:layout_centerHorizontal="true" android:clipChildren="false" /></RelativeLayout>

/** * * 实现封面浏览 * Created by alex_mahao on 2016/8/25. */public class CoverFlowViewPager extends RelativeLayout implements OnPageSelectListener { /** * 用于左右滚动 */ private ViewPager mViewPager; public CoverFlowViewPager(Context context, AttributeSet attrs) { super(context, attrs); inflate(context, R.layout.widget_cover_flow,this); mViewPager = (ViewPager) findViewById(R.id.vp_conver_flow); //init(); }

/** * 滚动的适配器 * Created by alex_mahao on 2016/8/25. */public class CoverFlowAdapter extends PagerAdapter implements ViewPager.OnPageChangeListener { /** * 默认缩小的padding值 */ public static int sWidthPadding; public static int sHeightPadding; /** * 子元素的集合 */ private List<View> mViewList; /** * 滑动监听的回调接口 */ private OnPageSelectListener listener; /** * 上下文对象 */ private Context mContext; public CoverFlowAdapter(List<View> mImageViewList, Context context) { this.mViewList = mImageViewList; mContext = context; // 设置padding值 sWidthPadding = dp2px(24); sHeightPadding = dp2px(32); } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView(mViewList.get(position)); } @Override public Object instantiateItem(ViewGroup container, int position) { View view = mViewList.get(position); container.addView(view); return view; } @Override public int getCount() { return mViewList == null ? 0 : mViewList.size(); } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { // 该方法回调ViewPager 的滑动偏移量 if (mViewList.size() > 0 && position < mViewList.size()) {  //当前手指触摸滑动的页面,从0页滑动到1页 offset越来越大，padding越来越大  Log.i("info", "重新设置padding");  int outHeightPadding = (int) (positionOffset * sHeightPadding);  int outWidthPadding = (int) (positionOffset * sWidthPadding);  // 从0滑动到一时，此时position = 0，其应该是缩小的，符合  mViewList.get(position).setPadding(outWidthPadding, outHeightPadding, outWidthPadding, outHeightPadding);  // position+1 为即将显示的页面，越来越大  if (position < mViewList.size() - 1) {  int inWidthPadding = (int) ((1 - positionOffset) * sWidthPadding);  int inHeightPadding = (int) ((1 - positionOffset) * sHeightPadding);  mViewList.get(position + 1).setPadding(inWidthPadding, inHeightPadding, inWidthPadding, inHeightPadding);  } } } @Override public void onPageSelected(int position) { // 回调选择的接口 if (listener != null) {  listener.select(position); } } @Override public void onPageScrollStateChanged(int state) { } /** * 当将某一个作为最中央时的回调 * * @param listener */ public void setOnPageSelectListener(OnPageSelectListener listener) { this.listener = listener; } /** * dp 转 px * * @param dp * @return */ public int dp2px(int dp) { int px = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, mContext.getResources().getDisplayMetrics()); return px; }}

 /** * 初始化方法 */ private void init() { // 构造适配器，传入数据源 mAdapter = new CoverFlowAdapter(mViewList,getContext()); // 设置选中的回调 mAdapter.setOnPageSelectListener(this); // 设置适配器 mViewPager.setAdapter(mAdapter); // 设置滑动的监听，因为adpter实现了滑动回调的接口，所以这里直接设置adpter mViewPager.addOnPageChangeListener(mAdapter); // 自己百度 mViewPager.setOffscreenPageLimit(5); // 设置触摸事件的分发 setOnTouchListener(new OnTouchListener() {  @Override  public boolean onTouch(View v, MotionEvent event) {  // 传递给ViewPager 进行滑动处理  return mViewPager.dispatchTouchEvent(event);  } }); }

 /** * 设置显示的数据，进行一层封装 * @param lists */ public void setViewList(List<View> lists){ if(lists==null){  return; } mViewList.clear(); for(View view:lists){  FrameLayout layout = new FrameLayout(getContext());  // 设置padding 值，默认缩小  layout.setPadding(CoverFlowAdapter.sWidthPadding,CoverFlowAdapter.sHeightPadding,CoverFlowAdapter.sWidthPadding,CoverFlowAdapter.sHeightPadding);  layout.addView(view);  mViewList.add(layout); } // 刷新数据 mAdapter.notifyDataSetChanged(); }

public interface OnPageSelectListener { void select(int position);}

 @Override public void onPageSelected(int position) { // 回调选择的接口 if (listener != null) {  listener.select(position); } }

 // 显示的回调 @Override public void select(int position) { if(listener!=null){  listener.select(position); } }