带有阴影的 ViewPager.PageTransformer答案

【问题标题】：ViewPager.PageTransformer with a drop shadow带有阴影的 ViewPager.PageTransformer
【发布时间】：2016-10-27 13:11:15
【问题描述】：

我在 ViewPager 中有一堆片段，自定义的 PageTransformer 定义如下。

mPager.setPageTransformer(true, new ViewPager.PageTransformer() {
    @Override
    public void transformPage(View page, float position) {
        page.setTranslationX(page.getWidth() * -position);
    }
});

如何为离开的片段绘制阴影？长话短说，我正在寻找 Play Book 中的东西，不需要卷曲效果，只是堆栈顶部元素的阴影，最好符合 API 18

谢谢

【问题讨论】：

标签： java android android-viewpager shadow android-pagetransformer

【解决方案1】：

我对@987654321@ 有疑问，因为它仅在传入视图具有 alpha 透明度时才有效。我的意思是，边缘的高度似乎错误，它位于传入视图的下方，但也许我找到了妥协

这是活动中的边距和自定义PageTransformer的代码

    int margin = getResources().getDisplayMetrics().widthPixels / 15;
    mPager = (ViewPager) findViewById(R.id.pager);

    mPager.setPageMargin(margin);
    mPager.setPageMarginDrawable(R.drawable.shadow);
    mPager.setPageTransformer(true, new StackTransformer());

可绘制对象定义为

    <shape xmlns:android="http://schemas.android.com/apk/res/android" 
       android:shape="rectangle" >
        <gradient
            android:angle="360"
            android:endColor="#00000000"
            android:startColor="#aa000000"
            android:type="linear" />
    </shape>

最后是 PageTransformer 的 transformPage 方法，我在其中使用位置和 alpha 来找到可以接受的效果

@Override
public void transformPage(View view, float position) {
    int pageWidth = view.getWidth();
    if (position < -1) {
        view.setAlpha(0);
    } else if (position <= 0) { 
        view.setAlpha(1);
        view.setTranslationX(0);
    } else if (position <= 1) { 
        view.setAlpha(1-position/2); // divide by 2 is the trick
        view.setTranslationX(pageWidth * -position);
    } else { 
        view.setAlpha(0);
    }
}

最终的效果就是你在上面的 gif 中看到的，但我敢肯定，那里有更好的方法来实现这个效果

【讨论】：