Adding dots to bottom of UIPageViewController screen

If anyone is searching for this kind of question still, I found a good tutorial about adding the page dots to your UIPageViewController. It worked for me, at least.

http://www.seemuapps.com/page-view-controller-tutorial-with-page-dots

This is the relevant part for this question:

Make sure you have the appropriate delegate and datasource

import UIKit

class PageViewController: UIPageViewController, UIPageViewControllerDelegate, UIPageViewControllerDataSource

To add the page dot indications add a pageControl as follows:

create an instance of UIPageControl.

var pageControl = UIPageControl()

Now add the following function. This will position the page control at the bottom of the screen. The current page indication will be black, and the rest of the indicators will be white. You can change these to suit the design of your app.

func configurePageControl() {
    pageControl = UIPageControl(frame: CGRect(x: 0,y: UIScreen.main.bounds.maxY - 50,width: UIScreen.main.bounds.width,height: 50))
    self.pageControl.numberOfPages = orderedViewControllers.count
    self.pageControl.currentPage = 0
    self.pageControl.alpha = 0.5
    self.pageControl.tintColor = UIColor.black
    self.pageControl.pageIndicatorTintColor = UIColor.white
    self.pageControl.currentPageIndicatorTintColor = UIColor.black
    self.view.addSubview(pageControl)
}

Now in viewDidLoad() add these two lines:

self.delegate = self
configurePageControl()

And add the following function, this will make sure the page control indicator changes to the correct page as you scroll through.

// MARK: Delegate functions
func pageViewController(_ pageViewController: UIPageViewController, didFinishAnimating finished: Bool, previousViewControllers: [UIViewController], transitionCompleted completed: Bool) {
    let pageContentViewController = pageViewController.viewControllers![0]
    self.pageControl.currentPage = orderedViewControllers.index(of: pageContentViewController)!
}

use the presentationCountForPageViewController and presentationIndexForPageViewController datasource methods then show UIPageViewController dots,

swift code:

private func setupPageControl() {
        let appearance = UIPageControl.appearance()
        appearance.pageIndicatorTintColor = UIColor.grayColor()
        appearance.currentPageIndicatorTintColor = UIColor.whiteColor()
        appearance.backgroundColor = UIColor.darkGrayColor()
    }

func presentationCountForPageViewController(pageViewController: UIPageViewController) -> Int
  {
    setupPageControl()
    return self.arrimg.count
  }

  func presentationIndexForPageViewController(pageViewController: UIPageViewController) -> Int
  {
    return 0
  }

objective-C code:

- (void) setupPageControl
{
    [[UIPageControl appearance] setPageIndicatorTintColor: [UIColor lightGrayColor]];
    [[UIPageControl appearance] setCurrentPageIndicatorTintColor: [UIColor blackColor]];
    [[UIPageControl appearance] setTintColor: [UIColor blackColor]];

}

- (NSInteger) presentationCountForPageViewController: (UIPageViewController *) pageViewController
{
    [self setupPageControl];
    return [arrimg count];
}

- (NSInteger) presentationIndexForPageViewController: (UIPageViewController *) pageViewController
{
    return 0;
}

its working for me, hope its helpful


When you use UIPageViewController the dots should be visible by default. I guess you have a white background and the dots are also white, so you just don't see them.

Try to change dots color:

Swift 4/5:

var appearance = UIPageControl.appearance(whenContainedInInstancesOf: [UIPageViewController.self])
appearance.pageIndicatorTintColor = UIColor.red
appearance.currentPageIndicatorTintColor = UIColor.red

Swift 3:

var appearance = UIPageControl.appearanceWhenContainedIn(UIPageViewController.self, nil)
appearance.pageIndicatorTintColor = UIColor.red
appearance.currentPageIndicatorTintColor = UIColor.red

If it doesn't help, make sure that you are using UIPageViewControllerTransitionStyleScroll transition style.

Also, make sure to implement this methods from the UIPageViewControllerDataSource: presentationCount(for:) and presentationIndex(for:).


For Swift 3.0, you need:

private func setupPageControl() {
    let appearance = UIPageControl.appearance()
    appearance.pageIndicatorTintColor = UIColor.gray
    appearance.currentPageIndicatorTintColor = UIColor.white
    appearance.backgroundColor = UIColor.darkGray
}

func presentationCount(for pageViewController: UIPageViewController) -> Int {
    setupPageControl()
    return self.images.count
}

func presentationIndex(for pageViewController: UIPageViewController) -> Int {
    return 0
}