[Android]ScaleViewPager--仿“想去”客户端图片展示效果--中轴旋转ViewPager动画实现

效果图

实现原理是使用ViewPager加上切换时的动画

下面是一些基础知识的传送门

中轴旋转 http://blog.csdn.net/guolin_blog/article/details/10766017
拖动式动画 http://blog.csdn.net/guolin_blog/article/details/10471245

ViewPager关键代码

设置VewPager后台持有多少个View（一般选择3以上），因为同一个屏幕内需要显示三个View(中间全部加左右View的一部分)

setOffscreenPageLimit();

设置左右View露出的多少

setPageMargin();

Adapter关键代码

设立的paddingLeft与PaddingRight要与上面ViewPager的PageMagin有一定关系，可以自己设置看效果

img.setPadding(paddingLeft, paddingTop, paddingRight,paddingBottom);

ScaleYViewPager源码

package com.usst.csl.viewpagergallery.ui;

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

import android.content.Context;
import android.content.res.TypedArray;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

public class ScaleYViewPager extends ViewPager {
	private int mPgerMargin = -350;

	private int mPaddingLeft = 130;
	private int mPaddingRight = 130;

	private int mPageLimit = 3;

	private List<Integer> mList;

	private DefaultViewPagerAdapter mAdapter;

	private Context mContext;

	private int mDefaultTopMargin = 16;
	private int mDefaultBottomMargin = 16;

	public ScaleYViewPager(Context context) {
		this(context, null);

	}

	public ScaleYViewPager(Context context, AttributeSet attrs) {
		super(context, attrs);

		mContext = context;
		TypedArray a = context.obtainStyledAttributes(attrs,
				R.styleable.ScaleYViewPager);
		mPageLimit = a.getInteger(
				R.styleable.ScaleYViewPager_offscreenPageLimit, mPageLimit);
		mPgerMargin = a.getInteger(R.styleable.ScaleYViewPager_pagerMargin,
				mPgerMargin);
		mPaddingLeft = a.getInteger(R.styleable.ScaleYViewPager_paddingLeft,
				mPaddingLeft);
		mPaddingRight = a.getInteger(R.styleable.ScaleYViewPager_paddingRight,
				mPaddingRight);
		a.recycle();
		setOffscreenPageLimit(mPageLimit);
		setPageMargin(mPgerMargin);
		setPageTransformer(true, new ScaleYPageTransformer());
		mList = new ArrayList<Integer>();
		mList.add(R.drawable.one);
		mList.add(R.drawable.two);
		mList.add(R.drawable.three);
		mList.add(R.drawable.four);
		mList.add(R.drawable.five);
		mList.add(R.drawable.six);
		mAdapter = new DefaultViewPagerAdapter(mList);
		setAdapter(mAdapter);
	}

	/**
	 * set the distance in the center view of the ViewPager
	 * 
	 * @param pagerDis
	 */
	public void setScaleYPagerMargin(int pagerDis) {
		setPageMargin(mPgerMargin);
		mAdapter.notifyDataSetChanged();
	}

	/**
	 * set the number of view cache,better > 3
	 * 
	 * @param pagerDis
	 */
	public void setScaleYOffscreenPageLimit(int pagerDis) {
		if (pagerDis < 3) {
			throw new IllegalArgumentException(
					"the offscreen page limit must >3");
		}
		setOffscreenPageLimit(pagerDis);
	}

	/**
	 * add some image resource to the list
	 * 
	 * @param list
	 */
	public void setImgResList(List<Integer> list) {
		if (list != null && list.size() > 0) {
			mList.clear();
			mList.addAll(list);
			mAdapter.notify();
		} else {
			throw new IllegalArgumentException("the list is illegal!");
		}
	}

	/**
	 * default adapter
	 * 
	 * @author KC
	 * 
	 */
	private class DefaultViewPagerAdapter extends PagerAdapter {

		private List<Integer> mList;

		public DefaultViewPagerAdapter(List<Integer> list) {
			this.mList = list;
		}

		@Override
		public int getCount() {
			return mList.size();
		}

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

		@Override
		public Object instantiateItem(ViewGroup container, int position) {
			ImageView img = new ImageView(mContext);
			img.setImageResource(mList.get(position));
			img.setPadding(mPaddingLeft, mDefaultTopMargin, mPaddingRight,
					mDefaultBottomMargin);
			((ViewPager) container).addView(img, position);
			return img;
		}

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

PageTransformer动画源码

package com.usst.csl.viewpagergallery.ui;

import android.support.v4.view.ViewPager.PageTransformer;
import android.view.View;

public class ScaleYPageTransformer implements PageTransformer {
	private static final float MIN_SCALE = 0.9f;
	private static final float MIN_ALPHA = 0.9f;
	private static final float ROTATION_Y = -30;

	public void transformPage(View view, float position) {
		int pageWidth = view.getWidth();
		int pageHeight = view.getHeight();

		if (position < -1) { // [-Infinity,-1)
			// This page is way off-screen to the left.
			view.setAlpha(0);

		} else if (position <= 1) { // [-1,1]
			// Modify the default slide transition to shrink the page as
			// well
			float scaleFactor = Math.max(MIN_SCALE, 1 - Math.abs(position));
			float vertMargin = pageHeight * (1 - scaleFactor) / 2;
			float horzMargin = pageWidth * (1 - scaleFactor) / 2;
			if (position < 0) {
				view.setTranslationX(horzMargin - vertMargin / 2);
			} else {
				view.setTranslationX(-horzMargin + vertMargin / 2);
			}

			// Scale the page down (between MIN_SCALE and 1)
			view.setScaleX(scaleFactor);
			view.setScaleY(scaleFactor);
			// rotate y
			view.setRotationY(position * ROTATION_Y);

			// Fade the page relative to its size.
			view.setAlpha(MIN_ALPHA + (scaleFactor - MIN_SCALE)
					/ (1 - MIN_SCALE) * (1 - MIN_ALPHA));

		} else { // (1,+Infinity]
			// This page is way off-screen to the right.
			view.setAlpha(0);
		}
	}
}

在XML中加载

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:scaleyviewpager="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".TestActivity" >

    <com.usst.csl.viewpagergallery.ui.ScaleYViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        scaleyviewpager:offscreenPageLimit="3"
        scaleyviewpager:pagerMargin="-350" />

</RelativeLayout>

下面是源码地址

https://github.com/ChenSiLiang/ScaleViewPager.git