CODEWITHSUNDEEP
iosobjective-cswiftuipageviewcontroller
Michael
Michael

Reputation: 33297

UIPageViewController intermediate transitions programmatically?

I have a UIPageViewController with n (n>>2) pages. The first page is yellow and the second one is blue. When I drag from one page to another I get a nice animation for the intermediate states as shown in the following image:

enter image description here

I tried to make to page transition from one to another page programmatically. I got the UIScrollView as:

for view:UIView in self.view.subviews as! [UIView] {
  if view.isKindOfClass(UIScrollView.self) {
    self.pageScrollView = view as? UIScrollView
  }
}

The I set the scroll position like this: 

self.pageScrollView!.contentOffset.x = screenWidth - deltaX

The result is the following:

enter image description here

The scroll position is updated but the next view is not loaded. This is why there is a white area on the right site. I know I can set the next page with setViewControllers but this will reveal the entire next page. What I want here is to reveal the next page programmatically only partial as I did with the dragging.

I know this can be done because the Tinder app is doing this already. When you make a pan gesture on the header the page view controller switches pages very smouth.

enter image description here

How can I emulate the page intermediate transitions programmatically?

Upvotes: 4

Views: 2919

Answers (3)

Esqarrouth
Esqarrouth

Reputation: 39181

Basically in swift all you need to write is:

pageViewController.setViewControllers([yourVC()], direction: UIPageViewControllerNavigationDirection.Forward, animated: true, completion: nil)

Here is a good tutorial:

https://www.youtube.com/watch?v=8bltsDG2ENQ

Upvotes: 1

Zahid
Zahid

Reputation: 562

I had the same issue and fixed it with setting a single viewController to make transition.

Like in objective-c

[self.pageControl setViewControllers:@[[self.viewControllers objectAtIndex:selectedPageIndex]] direction:UIPageViewControllerNavigationDirectionForward animated:YES completion:^(BOOL finished) {

    }];

Upvotes: 0

Rufel
Rufel

Reputation: 2660

You can't stop halfway on something that is paged. It is possible as long as a drag gesture is active, but as soon as you raise your finger and that gesture stop, the control will either show the next UIViewController or the one that was already being presented.

Using setViewControllers with animated:true will transition smoothly from the current UIViewController to the next as if you had dragged the view along with your finger:

.setViewControllers([allViewControllers[1]], direction: .Forward, animated: true, completion: nil)

If you want something more custom, you may need to use a UIScrollView instead of a UIPageViewController, and set the content yourself. Setting the pagingEnabled to true will make it behave like a UIPageViewController with a Scroll transition, but you could also keep the paging disabled and use a combination of setContentOffset:(contentOffset, animated) to make it scroll to your liking and the delegate scrollViewWillEndDragging:(scrollView, withVelocity, targetContentOffset) to make it "page".

I created a code sample here to illustrate what I mean. It is a simple UIScrollView that mimic a UIPageViewController, with basic view allocation/deallocation, and a way to scroll halfway programmatically.

Upvotes: 2

Related Questions