Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Controlling two ViewPager Together

I need to synchronize the two ViewPager together. The requirement is something like on scrolling the ViewPager-1 and the ViewPager-2 should also scroll by certain amount. The Image shown below will make you more clear with my question.

enter image description here

You can also help me with some tutorials link. Thanks.

like image 371
Nitin Bathija Avatar asked Dec 07 '12 06:12

Nitin Bathija


People also ask

How ViewPager2 works?

ViewPager2 supports paging through a modifiable collection of fragments, calling notifyDatasetChanged() to update the UI when the underlying collection changes. This means that your app can dynamically modify the fragment collection at runtime, and ViewPager2 will correctly display the modified collection.

How to set ViewPager in Android?

To use ViewPager and tabs, you need to add a dependency on ViewPager and on Material Components to your project. To insert child views that represent each page, you need to hook this layout to a PagerAdapter .

What is ViewPager2 in Android?

ViewPager2 uses FragmentStateAdapter objects as a supply for new pages to display, so the FragmentStateAdapter will use the fragment class that you created earlier. Create an activity that does the following things: Sets the content view to be the layout with the ViewPager2 .

How to Create ViewPager adapter in Android?

Steps for implementing viewpager: Adding the ViewPager widget to the XML layout (usually the main_layout). Creating an Adapter by extending the FragmentPagerAdapter or FragmentStatePagerAdapter class.


2 Answers

I think this is what you need:

        viewpager1.setOnTouchListener(new OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                viewpager2.onTouchEvent(event);
                return false;
            }
        });

        viewpager2.setOnTouchListener(new OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                viewpager1.onTouchEvent(event);
                return false;
            }
        });

I have a same problem, but first I try to use fakeDragBy method, which is dead end. (if you have more than two pages)

like image 90
Szelk Baltazár Avatar answered Sep 19 '22 07:09

Szelk Baltazár


You can extend ViewPager in order to create a custom view and override onTouchEvent() in the following way:

        @Override
        public boolean onTouchEvent(MotionEvent event) {

          if(mDependentView != null){
            mDependentView.onTouchEvent(event);
          }
          return super.onTouchEvent(event);
        }

Also create a setter inside your custom class in order to set the dependentView

public void setDependentView(View view){
   mDependentView = view;
}

Then you should set the second viewpager as dependent view of the first viewpager in your activity.

like image 21
k_shil Avatar answered Sep 21 '22 07:09

k_shil