Image (view) rotation is a common interface effect in many apps. We can also see a similar effect when we open the homepage of Jane Book. For its implementation, there are many methods on the Internet, the simplest method is nothing more than to add all views to a UIScrollView and set its paging property. Although this method is simple, but can not achieve the loop effect, and the page number control also needs us to calculate some values to set, and when the view can not be recycled, resulting in too many views on the same screen, resulting in a lag.

My First Approach

I’m trying to customize a UIView, then use DataSource separation to reuse a view like UITableView, then add UIScrollView, set the delegate, To achieve its func scrollViewWillEndDragging (scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer) proxy method. In this method, we can get the position that the view will scroll to when we release our finger, and we can also change the position that the view will scroll to using our pointer, so we just set the scroll View’s contentsides.width to three times the superView’s length, This leaves room to slide left and right, keeping contentOffset centrally located through the above proxy approach, and then dynamically repositioning the SubView to achieve the desired effect.

Here is the code for the proxy method:

func scrollViewWillEndDragging(scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer) { let targetOffsetIndex = self.calcIndexWithContentOffset(targetContentOffset.memory) if targetOffsetIndex == -1 { scrollView.contentOffset.x += scrollView.frame.width self._currentPageIndex = self.clampCellIndex(self._currentPageIndex - 1) } else if targetOffsetIndex == 1 { scrollView.contentOffset.x -= scrollView.frame.width self._currentPageIndex = self.clampCellIndex(self._currentPageIndex + 1) } targetContentOffset.memory = CGPoint(x: self.frame.width, y: 0) if targetOffsetIndex ! = 0 { self.layoutCarouselCells() } }Copy the code

This code is perfectly works, but it’s a little more complicated to implement.

In fact, iOS already gives us a ready-made way to implement round-robin.

The Final Destination

The answer is UIPageViewController~

Effect:




Preview

The implementation method is very simple, first paste code, and then explain:




Figure 1.

Since the UIPageViewController implements all the scrolling logic for us, let’s instantiate it directly and configure the dataSource and delegate. I can also set the margins. Next we add it to the existing View Controller as a Child View Controller, five pieces of code in fixed mode. Then set up the initial page and add a Page control.

DataSource:




Figure 2.

The nice thing is that UIPageController uses the current view to derive the previous view or the next view, so it’s easy to implement a round-robin. For example, the current view is the last one, and then “… after…” Method we can return the first view and implement the loop.

The Delegate is even simpler:




Figure 3.

Take the current view, go to its index setting and give it to Page Control.

The thing to notice here is that UIPageController needs a UIView controller, not a UIView.

The above.