Android ViewPager中的视差效果

pdj*_*pdj 14 android parallax android-viewpager

我试图在滑过片段时模仿视差效果,我读过有关beginFakeDrag和fakeDragBy但是说实话,我不知道它是否是解决我问题的最佳方法.

任何人都使用ViewPager做了类似的事情,或者暗示我应该如何处理这个问题?

谢谢

Chr*_*ell 14

不使用自定义库的简单方法是实现 ViewPager.PageTransformer

我创建了我的布局,使用相同id的背景元素.对于我的示例,所有背景图像都将使用idbackground

<ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/background"
    android:src="@drawable/img12"
    android:scaleType="fitXY"/>
Run Code Online (Sandbox Code Playgroud)

然后,当我进入实现时,ViewPager.PageTransformer我可以像这样引用该图像:

public class Transformer implements ViewPager.PageTransformer{
    @Override
    public void transformPage(View page, float position) {
        if(position >= -1 && position <= 1){
            page.findViewById(R.id.background).setTranslationX(-position * page.getWidth() / 2);
        } else {
            page.setAlpha(1);
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

最后,我给你我的ViewPager.PageTransformerViewPager喜欢这样.

ViewPager pager = (ViewPager) findViewById(R.id.pager);
pager.setPageTransformer(false, new Transformer());
Run Code Online (Sandbox Code Playgroud)


Mat*_*ieu 11

这个问题有点旧,但是当我试图做到这一点时,我发现了它...

我实现了自己的解决方案,基本上是扩展ViewPager和覆盖onDraw.

您可以在此处找到一个简单示例的所有代码


xgc*_*986 6

我知道它有点旧了但请看看https://github.com/xgc1986/ParallaxPagerLibrary

它不会覆盖onDraw方法,不仅影响图像,还适用于各种视图

mPager.setPageTransformer(false, new ParallaxTransformer(R.id.parallaxContent));
Run Code Online (Sandbox Code Playgroud)

R.id.paraallaxContent是您想要具有此效果的视图的ID

除非其他解决方案,不需要任何具体的结构工作,也是独立的布局

演示:youtube