Manjunath
Manjunath

Reputation: 2063

Circular ViewPager for continuous scrolling

I am displaying a ViewPager containing only ImageViews. But, I need it to happen continuously in a circular manner. For Ex : ...c > B > A > B > c...

Upvotes: 4

Views: 8060

Answers (3)

Miguel Lasa
Miguel Lasa

Reputation: 518

The following did it for me. I didn't want the user to scroll "back" from the first page to the last. So basically I have three different screens, but I actually have four in the adapter, like so: A -> B -> C -> A. When the user hits the second 'A' page, and the pager state becomes IDLE, I seamlessly switch to the first 'A' page. I even have a page indicator which I've similarly overridden.

val pageChangeCallback = object : ViewPager2.OnPageChangeCallback() {
        override fun onPageScrollStateChanged(state: Int) {
            super.onPageScrollStateChanged(state)

            if (state == ViewPager.SCROLL_STATE_IDLE) {
                if (viewPager.currentItem == NUM_PAGES - 1) {
                    viewPager.setCurrentItem(0, false)
                }
            }
        }
    }

Upvotes: 1

Muhammed Haris
Muhammed Haris

Reputation: 380

try this one. it will get results like C <--> A <--> B <--> C <--> A

viewPager?.addOnPageChangeListener(object : ViewPager.OnPageChangeListener {
      var currentPage : Int = 0
      var mPreviousPosition : Int = 0
      var mIsEndOfCycle = false
      override fun onPageScrollStateChanged(state: Int) {
        val pageCount = viewPager?.adapter?.count
        if (state == ViewPager.SCROLL_STATE_IDLE) {
          if (mPreviousPosition == currentPage && !mIsEndOfCycle) {
            if (currentPage == 0) {
              pageCount?.minus(1)?.let { viewPager?.setCurrentItem(it, false) };
            } else {
              viewPager?.setCurrentItem(0, false);
            }
            mIsEndOfCycle = true;
          } else {
            mIsEndOfCycle = false;
          }
          mPreviousPosition = currentPage;
        }
      }

      override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) {}

      override fun onPageSelected(position: Int) {
        currentPage = position
      }

    })

Upvotes: 2

Andreas
Andreas

Reputation: 1617

Just implement the ViePager.OnPageChangeListener:

YOUR_VIEWPAGER.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
    @Override
    public void onPageSelected(int position) {
      currentPage = position;
    }
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
      // not needed
    }
    @Override
    public void onPageScrollStateChanged(int state) {
      if (state == ViewPager.SCROLL_STATE_IDLE) {
        int pageCount = pages.size();

        if (currentPage == 0){
          YOUR_VIEWPAGER.setCurrentItem(pageCount-2,false);
        } else if (currentPage == pageCount-1){
          YOUR_VIEWPAGER.setCurrentItem(1,false);
        }
      }
    }
  });

Upvotes: 4

Related Questions