使用View Pager进行循环滚动

时间:2018-04-23 19:45:46

标签: android android-viewpager infinite-scroll android-scrollview android-scrolling

我们要求使用滑动图像协调旋转轮。我已经使用了 ViewPager 但是在360度旋转之后

我必须从 X = 0 开始滚动 ViewPager 。是否有 ViewPager 从滚动到最后位置后从第一页开始?

  

我使用 setScrollX 滚动 ViewPager ,这也介绍了   旋转动画时出现故障。我希望实现类似的目标   在图像下面。

这是示例应用程序的link,只是我想要实现的最小化实现。

enter image description here

3 个答案:

答案 0 :(得分:3)

为此编写自定义视图更简单。布局看起来很简单(只是一堆图像),ViewPager对于像这样的简单事情有很大的开销。使用自定义视图,您还可以通过触摸侦听器处理自己滚动。

答案 1 :(得分:1)

如果你想要实现类似你的设计,那么我建议你使用ArcLayoutManager库,我已经使用这个库和recycleler View来获得Arc Like菜单。

答案 2 :(得分:1)

忘记ViewPager这是昂贵的,观点就是一切。你需要三个膨胀的观点 我们说v1v2v3

我使用您提供的git示例项目,将您的HorizontalPaging替换为xml

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:id="@+id/scroller"
        app:layout_constraintEnd_toEndOf="parent"
        android:fillViewport="true"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">


        <ImageView
            android:id="@+id/v1"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:contentDescription="@null"
            android:src="@drawable/slider_topup" />

        <ImageView
            android:id="@+id/v2"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:contentDescription="@null"
            android:src="@drawable/slider_balance" />

        <ImageView
            android:id="@+id/v3"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:contentDescription="@null"
            android:src="@drawable/slider_bundles" />

    </RelativeLayout>

并将代码添加到onCreate

final View v1 = findViewById(R.id.v1);
        final View v2 = findViewById(R.id.v2);
        final View v3 = findViewById(R.id.v3);

        //set initial state keep it sync with wheel at start
        v1.setX(0);
        v2.setX(screenSize);
        v3.setX(2*screenSize);

        circle.setOnAngleChangeListener(new NowCircle.OnAngleChangeListener() {
            @Override
            public void onAngleChange(float delta) {
                float v1x = v1.getX() + (oneDegree * delta);
                float v2x = v2.getX() + (oneDegree * delta);
                float v3x = v3.getX() + (oneDegree * delta);

                Log.d("dd","delta:"+delta+", v1x:"+v1x+", v2x:"+v2x +", v3x:"+v3x);

                v1.setX(v1x);
                v2.setX(v2x);
                v3.setX(v3x);

                if(delta > 0){

                    if (v1x >= 0 && v1x <= screenSize) {
                        v3.setX(-screenSize+v1x);
                        //update data here
                    }else if (v3x >= 0  && v3x <= screenSize){
                        v2.setX(-screenSize+v3x);
                        //update data here
                    }else {
                        v1.setX(-screenSize+v2x);
                        //update data here
                    }
                }else {
                    if (v3x <= 0 && v3x >= -screenSize) {
                        v1.setX(screenSize+v3x);
                        //update data here
                    }else if(v1x <= 0 && v1x >= -screenSize){
                        v2.setX(screenSize+v1x);
                        //update data here
                    }else {
                        v3.setX(screenSize+v2x);
                        //update data here
                    }
                }
            }
        });

动画实现,工作正常。

enter image description here

您需要改进此功能并将数据与自定义视图绑定,并创建一个单独的管理类。我把时间花在了这上面。你知道:)。