How to put the UIPageControl element on top of the sliding pages within a UIPageViewController?

Question

Regarding to this tutorial by AppCoda about how to implement a app with UIPageViewController I\'d like to use a custom page control element on top of the pages instead of at

Answer 1

After further investigation and searching I found a solution, also on stackoverflow.

The key is the following message to send to a custom UIPageControl element:

[self.view bringSubviewToFront:self.pageControl];

The AppCoda tutorial is the foundation for this solution:

Add a UIPageControl element on top of the RootViewController - the view controller with the arrow.

Create a related IBOutlet element in your ViewController.m.

In the viewDidLoad method you should then add the following code as the last method you call after adding all subviews.

[self.view bringSubviewToFront:self.pageControl];

To assign the current page based on the pageIndex of the current content view you can add the following to the UIPageViewControllerDataSource methods:

- (UIPageViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerBeforeViewController:(UIViewController *)viewController
{
    // ...
    index--;
    [self.pageControl setCurrentPage:index];

    return [self viewControllerAtIndex:index];
}

- (UIPageViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerAfterViewController:(UIViewController *)viewController
{
    // ...
    index++;
    [self.pageControl setCurrentPage:index];

    // ...
    return [self viewControllerAtIndex:index];
}