使用Viewpager来实现卡片样式（附带ViewPager.PageTransformer解析）

需求：需要一个类似老板探探哪有的滑动效果，来展示我们的商品，但是客户还可以划回去看上一个商品。

OK，需求说啥就是啥吧，谁让我们是苦逼的搬转呢。

先来看下实现后的效果：

这里详细介绍下ViewPager.PageTransformer这个类的transformPage这个唯一实现的函数，也是这个效果的重点，其实实现并不复杂。
transformPage一共有2个参数，一个page指当前移动的view对象，还有一个参数position
这个需要详细说下。

transformPage 这个方法会多次被调用，当我们滑动的时候，同一时间这个方法会被不同的page同时调用，同时position会也会是对应的page的position。
看下这个图

当我们向左边滑动的时候，viewpager对应的所有页面，都在会调用transformPage函数，同时吧自己的实现和position传过去，如原来是0，position 会从0 到 -1 移动，同理 其他也一样，在不设置OffscreenPageLimit情况下，vp最多会有3个，如果设置了，会对应的增加。
最后贴下实现代码 核心：

package com.example.similarcardpagetransformer.usevp;

import android.util.Log;
import android.view.View;
import android.widget.Toast;

import androidx.annotation.NonNull;
import androidx.core.view.ViewCompat;
import androidx.viewpager.widget.ViewPager;

/**
 * author: eagle
 * created on: 2019-09-16 13:29
 * description:
 */
public class CardPageTransformer implements ViewPager.PageTransformer {
    private ViewPager mCurrentViewPager;

    private static final float CENTER_PAGE_SCALE = 0.85f;

    //页面显示限制 一般为mCurrentViewPager.getOffscreenPageLimit()   PS:特别提示  如果这样用需要再外面设置 否则不显示
    private int mOffscreenPageLimit;

    public CardPageTransformer(ViewPager viewPager) {
        this.mCurrentViewPager = viewPager;
        this.mOffscreenPageLimit = mCurrentViewPager.getOffscreenPageLimit();
    }

    @Override
    public void transformPage(@NonNull View page, float position) {

        if (position > -1 && position < 0) {
            float rotation = position * 30;
            page.setRotation(rotation);
            page.setAlpha((position + 1));
        } else if (position > mOffscreenPageLimit - 1) {
            page.setAlpha((float) (1 - position + Math.floor(position)));
        } else {
            page.setRotation(0);
            page.setAlpha(1);
        }

        Log.d("Position值", "测试" + position);
        //对对应页面设置缩放比例
        if (position == 0) {
            page.setScaleX(CENTER_PAGE_SCALE);
            page.setScaleY(CENTER_PAGE_SCALE);
        } else {
            float scaleFactor = Math.min(CENTER_PAGE_SCALE - position * 0.1f, CENTER_PAGE_SCALE);
            page.setScaleX(scaleFactor);
            page.setScaleY(scaleFactor);
        }

        //针对显示的 进行偏移 需要其他样式 修改这个
        if (position >= 0) {
            //例子 向下 具体根据你的需求来定义
            page.setTranslationY(130 * position);
            page.setTranslationX(-page.getWidth() * position);
            //例子 向上
//            page.setTranslationY(-120 * position);
//            page.setTranslationX(-page.getWidth() * position);
            //例子 向左
//            page.setTranslationY(0);
//            page.setTranslationX(-page.getWidth() * position - 100 * position);
            //例子 向右
//            page.setTranslationY(0);
//            page.setTranslationX(-page.getWidth() * position + 100 * position);

        }
        //超出部分一律不显示
        if (position >= mOffscreenPageLimit || position <= -1) {
            page.setVisibility(View.INVISIBLE);
        } else {
            page.setVisibility(View.VISIBLE);
        }

        //设置阴影的
//        ViewCompat.setElevation(page, (mOffscreenPageLimit - position) * 3);
    }


}

可以直接拿去改，使用方法如下：

mViewPager.setPageTransformer(true, new CardPageTransformer(mViewPager));

下面最后附上git地址：https://github.com/MasterSumCloud/SimilarCardPageTransformer