ViewPager一个卡片层叠效果，记录下计算算法

最新推荐文章于 2025-03-12 11:11:07 发布

原创最新推荐文章于 2025-03-12 11:11:07 发布

· 470 阅读

0 ·

版权

文章标签：

#android

本身没有难度，记录下算法和阴影数值而已。
在这里插入图片描述

package com.example.testtransformer;

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

import androidx.annotation.NonNull;
import androidx.viewpager.widget.ViewPager;

public class CardTransformer implements ViewPager.PageTransformer {

    @Override
    public void transformPage(@NonNull View view, float position) {
        Log.e("info", "transformPage======>" + position);
        //缩放比例
        int mScale = 70;
        float scale = (view.getWidth() - mScale * position) / (float) (view.getWidth());

        // 设置卡片背景色
        if (view.getBackground() == null) {
            view.setBackgroundColor(0xFFFFFFFF);
        }
        // 设置Z轴及阴影
        view.setTranslationZ(scale * 20);
        // 设置横向缩放
        view.setScaleX(scale * 0.85f);
        // 设置纵向缩放
        view.setScaleY(scale * 0.85f);

        if (position <= 0.0f) {         // 当前页

            //X轴偏移
            view.setTranslationX((view.getWidth() / 3f * position));

            //打开点击事件
            view.setClickable(true);

        } else if (position > 0) {      // 后一页

            //X轴偏移
            int mTranslation = 61;
            view.setTranslationX((-view.getWidth() * position) + (mTranslation * position));

            //屏蔽点击事件
            view.setClickable(false);
        }
    }

}