How can I make uiscrollview infinite in iOS?

Question

I want to scroll like that 1 2 3 1 2 3

I have some buttons suppose 10 which i want to show on endless scroll.

 numbercolors=[[NSMutableArray alloc         


        

Answer 1

This is an old question, but I'm writing this to help whom searching for same solution. Suppose that we wish to infinitely loop through 3 items(cells) - C0, C1, C2, we can generate dummy cells at the left and right side of center cells, the result as follows,

C0 C1 C2 [C0 C1 C2] C0 C1 C2

Cells in bracket are cells we see through device screen, and if we scroll to left,

C0 [C1 C2 C0] C1 C2 C0 C1 C2

at this moment, force contentOffset to point right side of given dummy cells,

C0 [C1 C2 C0] C1 C2 C0 C1 C2 -> C0 C1 C2 C0 [C1 C2 C0] C1 C2

Since it's time consuming job to implement this seamlessly, I recommend my solution below.

https://github.com/DragonCherry/HFSwipeView

If you just wanna check how it works, click link below and "tap to play".

https://www.cocoacontrols.com/controls/hfswipeview

Answer 2

For right infinite scroll you can use -

        let rightOffset = CGPoint.init(x: (scrollView.contentSize.width) - (scrollView.bounds.width), y: 0)
    UIView.animate(withDuration: 3.0,
                   delay: 0.0,
                   options: [.curveLinear, .repeat],
                   animations: { () -> Void in
                    self.scrollView.contentOffset = rightOffset

    }, completion: { (finished: Bool) -> Void in
        self.scrollView.setContentOffset(.init(x: 0, y: self.scrollView.contentOffset.y), animated: false)
    })

Answer 3

I have written an infinite rolling UIscrollView subclass which accomplishes this task. It is based on the Apple StreetScroller sample. You simply provide it with your button titles and whether you want a horizontal or vertical scroll. You can also set many other options. It is posted with documentation and a sample project on my github. Here is the link...

http://github.com/ninefifteen/SSRollingButtonScrollView

Answer 4

Main idea is to reposition your scrollview back to some constant value, when it has been scrolled to some value and then auto-reposition your "1" , "2", "3" items correctly.

For example - You would have scrollview with contentwidth 5000. By default You set it to position 2500.

then You simply check in - (void)scrollViewDidCScroll:(UIScrollView *)scrollview - if scrollview.contentoffset.x > 3500 - then decrease it's position to scrollview.contentoffset.x -=1000;

and the same about other side. This will result in infinite scrolling.

But content will not follow. So - You would need to implement extra content offset value checking to reorder and reposition correctly "1", "2", "3", items.

I usually use 3 elements and then dynamically preload necessary gallery image for them.

If You don't want to re-invent the "wheel" , check out these solutions:

https://www.cocoacontrols.com/controls/dmcircularscrollview

https://www.cocoacontrols.com/controls/infinitescrollview

https://www.cocoacontrols.com/controls/iainfinitegridview

Answer 5

I've implemented an infinite scroller in swift.
It's inspired by apple StreetScroller example

I know is not perfect yet, but I think is a god start point.

InfiniteVerticalScroller

Answer 6

The answers provided here are good but if you're still not satisfied and looking for a different approach here's what I've done.

The main idea is to update the number of cells whenever you reach the cell before the last one. Each time you increase the number of items by 1 so it gives the illusion of infinite scrolling. To do that we can utilize scrollViewDidEndDecelerating(_ scrollView: UIScrollView) function to detect when the user has finished scrolling, and then update the number of items in the collection view. Here's a code snippet to achieve that:

class InfiniteCarouselView: UICollectionView {

    var data: [Any] = []

    private var currentIndex: Int?
    private var currentMaxItemsCount: Int = 0
    // Set up data source and delegate
}

extension InfiniteCarouselView: UICollectionViewDataSource {
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        // Set the current maximum to a number above the maximum count by 1
        currentMaxItemsCount = max(((currentIndex ?? 0) + 1), data.count) + 1
        return currentMaxItemsCount

    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath)
        let row = indexPath.row % data.count
        let item = data[row]
        // Setup cell
        return cell
    }
}

extension InfiniteCarouselView: UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: collectionView.frame.width, height: collectionView.frame.height)
    }

    // Detect when the collection view has finished scrolling to increase the number of items in the collection view
    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
        // Get the current index. Note that the current index calculation will keep changing because the collection view is expanding its content size based on the number of items (currentMaxItemsCount)
        currentIndex = Int(scrollView.contentOffset.x/scrollView.contentSize.width * CGFloat(currentMaxItemsCount))
        // Reload the collection view to get the new number of items
        reloadData()
    }
}

Pros

• Straightforward implementation
• No use of Int.max (Which in my own opinion is not a good idea)
• No use of an arbitrary number (Like 50 or something else)
• No change or manipulation of the data
• No manual update of the content offset or any other scroll view attributes

Cons

• Paging should be enabled (Although the logic can be updated to support no paging)
• Need to maintain a reference for some attributes (current index, current maximum count)
• Need to reload the collection view on each scroll end (Not a big deal if the visible cells are minimal). This might affect you drastically if you're loading something asynchronously without caching (Which is a bad practice and data should be cached outside the cells)
• Doesn't work if you want infinite scroll in both directions