Programmatically-added page control disappears when setting view controllers after setup

Problem

When tapping the skip button on page i (which calls setViewControllers(_:animated:) and transitions the user to the last page in the page view controller), and then swiping back to page i again, the page control disappears.

Wanted result

I want to programmatically add and show a custom page control on the bottom of each view controller in a page view controller when said page view controller contains different types of view controllers.

Efforts so far to resolve the issue

Adding the page control to the base view controller each time it appears.
Calling loadView() on the view controller that contains the missing page control.

Code

I have a WalkthroughRootViewController that contains a UIPageViewController. The type of the view controllers in the page view controller are two subclasses of type WalkthroughBaseViewController, the first n-1 of one type, and the last of the other. I have not included code of the last type, as that's working as far as I can see.

I have this code in WalkthroughBaseViewController:

lazy var pageControl: UIPageControl = {
    let pageControl = UIPageControl(frame: .zero)
    pageControl.translatesAutoresizingMaskIntoConstraints = false
    pageControl.numberOfPages = numberOfPages
    pageControl.sizeToFit()
    pageControl.pageIndicatorTintColor = Colors.brown
    pageControl.currentPageIndicatorTintColor = Colors.silver
    pageControl.isUserInteractionEnabled = false
    pageControl.isEnabled = false
    return pageControl
}()

The page control is added to the view in viewDidLoad():

view.addSubview(pageControl)
NSLayoutConstraint.activate([
    pageControl.bottomAnchor.constraint(equalTo: view.bottomAnchor),
    pageControl.centerXAnchor.constraint(equalTo: view.centerXAnchor)
])

If the user is on any of the first n-1 view controllers, there is a skip button the user can tap to skip forward to the last view controller. The code for this is

func skipWalkthrough() {
    guard let viewController = walkthroughPageViewControllerDataSource.viewController(at: lastIndex, storyboard: storyboard!) else { return }
    walkthroughPageViewController.setViewControllers([viewController], direction: .forward, animated: true)
}

Reference

I have highlighted the code I believe is important, but here are all files related to the walkthrough of the application.

`WalkthroughRootViewController`

import UIKit

class WalkthroughRootViewController: UIViewController {

    // MARK: Regular Properties
    var walkthroughPageViewController: UIPageViewController!
    var walkthroughImages = [
        Images.w1,
        Images.w2
    ]
    var walkthroughStrings: [String] = [
        .localized(.walkthroughTitle1),
        .localized(.walkthroughZipCodeTitle)
    ]

    // MARK: Lazy Properties
    lazy var walkthroughPageViewControllerDataSource: WalkthroughPageViewControllerDataSource = {
        var dataSource = WalkthroughPageViewControllerDataSource()
        dataSource.walkthroughRootViewController = self
        return dataSource
    }()

    // MARK: Computed Properties
    var lastIndex: Int {
        return walkthroughImages.count - 1
    }
    var temporaryUserInput: String?
    var temporarySwitchPosition = false

    override var preferredStatusBarStyle: UIStatusBarStyle {
        return .lightContent
    }
}

// MARK: View Controller Life Cycle

extension WalkthroughRootViewController {
    override func viewDidLoad() {
        super.viewDidLoad()

        // Stop gray shadow from appearing under transition.
        navigationController?.view.backgroundColor = .white

        configurePageViewController()
    }
}

// MARK: Helper Methods

extension WalkthroughRootViewController {
    func configurePageViewController() {
        walkthroughPageViewController = UIPageViewController(transitionStyle: .scroll, navigationOrientation: .horizontal, options: nil)
        walkthroughPageViewController.dataSource = walkthroughPageViewControllerDataSource
        walkthroughPageViewController.delegate = walkthroughPageViewControllerDataSource

        let startingViewController = storyboard!.instantiateViewController(withIdentifier: Strings.ViewControllerIdentifiers.walkthroughImage) as! WalkthroughImageViewController
        let startIndex = 0
        startingViewController.delegate = self
        startingViewController.pageIndex = startIndex
        startingViewController.text = walkthroughStrings[startIndex]
        startingViewController.image = walkthroughImages[startIndex]
        startingViewController.numberOfPages = walkthroughImages.count

        walkthroughPageViewController.setViewControllers([startingViewController], direction: .forward, animated: true)
        walkthroughPageViewController.view.frame = view.bounds
        add(walkthroughPageViewController)
    }
}

extension WalkthroughRootViewController: WalkthroughDelegate {
    func skipWalkthrough() {
        guard let viewController = walkthroughPageViewControllerDataSource.viewController(at: lastIndex, storyboard: storyboard!) else { return }
        walkthroughPageViewController.setViewControllers([viewController], direction: .forward, animated: true)
    }
}

extension WalkthroughRootViewController: WalkthrouZipCodeViewControllerDelegate {
    func walkththroughZipCodeViewController(_ viewController: WalkthroughZipCodeViewController, userEnteredText enteredText: String) {
        temporaryUserInput = enteredText
    }

    func walkthroughZipCodeViewController(_ viewController: WalkthroughZipCodeViewController, userChangedSwitchPosition position: Bool) {
        temporarySwitchPosition = position
    }
}

`WalkthroughBaseViewController`

import UIKit

protocol WalkthroughDelegate: class {
    func skipWalkthrough()
}

class WalkthroughBaseViewController: UIViewController {
    // MARK: Regular Properties
    var pageIndex = 0
    var text = ""
    var delegate: WalkthroughDelegate?
    var numberOfPages = 0

    // Lazy Properties
    lazy var pageControl: UIPageControl = {
        let pageControl = UIPageControl(frame: .zero)
        pageControl.translatesAutoresizingMaskIntoConstraints = false
        pageControl.numberOfPages = numberOfPages
        pageControl.sizeToFit()
        pageControl.pageIndicatorTintColor = Colors.brown
        pageControl.currentPageIndicatorTintColor = Colors.silver
        pageControl.isUserInteractionEnabled = false
        pageControl.isEnabled = false
        return pageControl
    }()
}

// MARK: View Controller Life Cycle

extension WalkthroughBaseViewController {
    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = Colors.silver

        view.addSubview(pageControl)
        NSLayoutConstraint.activate([
            pageControl.bottomAnchor.constraint(equalTo: view.bottomAnchor),
            pageControl.centerXAnchor.constraint(equalTo: view.centerXAnchor)
        ])

        view.accessibilityIdentifier = Strings.AccessibilityIdentifiers.walkthrough
    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        pageControl.currentPage = pageIndex
    }
}

`WalkthroughImageViewController`

import UIKit

class WalkthroughImageViewController: WalkthroughBaseViewController {
    // MARK: @IBOutlets
    @IBOutlet weak var titleLabel: UILabel! {
        didSet {
            titleLabel.adjustsFontSizeToFitWidth = true
            titleLabel.textColor = Colors.silver
            titleLabel.numberOfLines = 0
        }
    }
    @IBOutlet weak var skipWalkthroughButton: UIButton! {
        didSet {
            skipWalkthroughButton.setTitleColor(Colors.silver, for: .normal)
            skipWalkthroughButton.titleLabel?.font = UIFont.preferredBoldFont(for: .body)
            skipWalkthroughButton.setTitle(.localized(.skip), for: .normal)
        }
    }
    @IBOutlet weak var imageView: UIImageView! {
        didSet {
            imageView.layer.shadowColor = Colors.brown.cgColor
            imageView.layer.shadowOffset = CGSize(width: 0, height: 1)
            imageView.layer.shadowOpacity = 1
            imageView.layer.shadowRadius = 1.0
            imageView.clipsToBounds = false
            imageView.contentMode = .scaleAspectFill
        }
    }

    // MARK: Regular Properties
    var image: UIImage?

    // MARK: View Controller Life Cycle
    override func viewDidLoad() {
        super.viewDidLoad()

        imageView.image = image
        titleLabel.text = text
    }
}

// MARK: @IBActions

extension WalkthroughImageViewController {
    @IBAction func skipWalkthrough(_ sender: UIButton) {
        delegate?.skipWalkthrough()
    }
}

`WalkthroughPageViewControllerDataSource`

import UIKit

class WalkthroughPageViewControllerDataSource: NSObject {
    // MARK: Regular Properties
    var walkthroughRootViewController: WalkthroughRootViewController!
}

extension WalkthroughPageViewControllerDataSource: UIPageViewControllerDataSource {
    func pageViewController(_ pageViewController: UIPageViewController, viewControllerBefore viewController: UIViewController) -> UIViewController? {
        var index = indexOfViewController(viewController as! WalkthroughBaseViewController)

        if index == NSNotFound || index == 0 {
            return nil
        }

        index -= 1

        return self.viewController(at: index, storyboard: walkthroughRootViewController.storyboard!)

    }

    func pageViewController(_ pageViewController: UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? {
        var index = indexOfViewController(viewController as! WalkthroughBaseViewController)

        if index == NSNotFound {
            return nil
        }

        index += 1

        if index == walkthroughRootViewController.walkthroughImages.count {
            return nil
        }

        return self.viewController(at: index, storyboard: walkthroughRootViewController.storyboard!)
    }
}

extension WalkthroughPageViewControllerDataSource {
    func viewController(at index: Int, storyboard: UIStoryboard) -> WalkthroughBaseViewController? {
        if walkthroughRootViewController.walkthroughImages.count == 0 || index >= walkthroughRootViewController.walkthroughImages.count {
            return nil
        }

        var viewController: WalkthroughBaseViewController?

        if index == walkthroughRootViewController.lastIndex {
            viewController = storyboard.instantiateViewController(withIdentifier: Strings.ViewControllerIdentifiers.walkthroughZipCode) as? WalkthroughZipCodeViewController
            if let viewController = viewController as? WalkthroughZipCodeViewController {
                viewController.pageIndex = index
                viewController.walkthroughZipCodeDelegate = walkthroughRootViewController
                viewController.temporaryUserInput = walkthroughRootViewController.temporaryUserInput
                viewController.temporarySwitchPosition = walkthroughRootViewController.temporarySwitchPosition
                viewController.numberOfPages = walkthroughRootViewController.walkthroughImages.count
                viewController.image = walkthroughRootViewController.walkthroughImages[index]
            }
        } else {
            viewController = storyboard.instantiateViewController(withIdentifier: Strings.ViewControllerIdentifiers.walkthroughImage) as? WalkthroughImageViewController
            if let viewController = viewController as? WalkthroughImageViewController {
                viewController.delegate = walkthroughRootViewController
                viewController.pageIndex = index
                viewController.image = walkthroughRootViewController.walkthroughImages[index]
                viewController.text = walkthroughRootViewController.walkthroughStrings[index]
            }
        }

        return viewController
    }

    func indexOfViewController(_ viewController: WalkthroughBaseViewController) -> Int {
        return viewController.pageIndex
    }
}

extension WalkthroughPageViewControllerDataSource: UIPageViewControllerDelegate {
}

Solution

Create a single UIPageControl that you put in the WalkthroughRootViewController and update it when you navigate the pages - don't create a page control for each child.

Try not to use extensions to override methods - it can cause you trouble - see this blog entry.