Remove Black Edges from UIPageViewController in Swift 3

Question

I am using Swift 3.0 and have created a UIPageViewController currently with two pages (each one is a UIViewController). When I run the app, everything works fine, except that there are black spaces at the bottom and the right side of the app when the ViewControllers are shown. I also cannot see the page dots in the PageViewController. I have implemented the functions to place the dots on the screen:

func pageViewController(pageViewController: PageViewController,
                             didUpdatePageCount count: Int)

func pageViewController(pageViewController: PageViewController,
                             didUpdatePageIndex index: Int)

Layout

View Controller Inside the PageViewController

PageViewController Settings

Would anyone know how to fix the black borders around the pages and add the page dots?

Update

    import UIKit

class PageViewController: UIPageViewController {

    weak var pageDelegate: PageViewControllerDelegate?

    private(set) lazy var orderedViewControllers: [UIViewController] = {
        // The view controllers will be shown in this order
        return [self.newViewController(name: "view1"),
                self.newViewController(name: "view2"),
                self.newViewController(name: "view3"),
                self.newViewController(name: "view4"),
                self.newViewController(name: "view5")]
    }()

    override func viewDidLoad() {
        super.viewDidLoad()

        dataSource = self
        delegate = self

        if let initialViewController = orderedViewControllers.first {
            scrollToViewController(viewController: initialViewController, direction: UIPageViewControllerNavigationDirection.forward)
        }

        pageDelegate?.pageViewController(pageViewController: self, didUpdatePageCount: orderedViewControllers.count)

    }

    /**
     Scrolls to the next view controller.
     */
    func scrollToNextViewController() {
        if let visibleViewController = viewControllers?.first,
            let nextViewController = pageViewController(self, viewControllerAfter: visibleViewController) {
            scrollToViewController(viewController: nextViewController, direction: UIPageViewControllerNavigationDirection.forward)
        }
    }

    /**
     Scrolls to the view controller at the given index. Automatically calculates
     the direction.

     - parameter newIndex: the new index to scroll to
     */
    func scrollToViewController(index newIndex: Int) {
        if let firstViewController = viewControllers?.first,
            let currentIndex = orderedViewControllers.index(of: firstViewController) {
            let direction: UIPageViewControllerNavigationDirection = newIndex >= currentIndex ? .forward : .reverse
            let nextViewController = orderedViewControllers[newIndex]
            scrollToViewController(viewController: nextViewController, direction: direction)
        }
    }

    private func newViewController(name: String) -> UIViewController {
        return UIStoryboard(name: "Main", bundle: nil) .
            instantiateViewController(withIdentifier: "\(name)ViewController")
    }

    /**
     Scrolls to the given 'viewController' page.

     - parameter viewController: the view controller to show.
     */
    private func scrollToViewController(viewController: UIViewController,
                                        direction: UIPageViewControllerNavigationDirection = .forward) {
        setViewControllers([viewController],
                           direction: direction,
                           animated: true,
                           completion: { (finished) -> Void in
                            // Setting the view controller programmatically does not fire
                            // any delegate methods, so we have to manually notify the
                            // 'pageDelegate' of the new index.
                            self.notifyPageDelegateOfNewIndex()
        })
    }

    /**
     Notifies '_pageDelegate' that the current page index was updated.
     */
    func notifyPageDelegateOfNewIndex() {
        if let firstViewController = viewControllers?.first,
            let index = orderedViewControllers.index(of: firstViewController) {
            self.pageDelegate?.pageViewController(pageViewController: self, didUpdatePageIndex: index)
        }
    }

}

// MARK: UIPageViewControllerDataSource

extension PageViewController: UIPageViewControllerDataSource {

    func pageViewController(_ pageViewController: UIPageViewController,
                            viewControllerBefore viewController: UIViewController) -> UIViewController? {
        guard let viewControllerIndex = orderedViewControllers.index(of: viewController) else {
            return nil
        }

        let previousIndex = viewControllerIndex - 1

        // User is on the first view controller and swiped left to loop to
        // the last view controller.
        guard previousIndex >= 0 else {
            return orderedViewControllers.last
        }

        guard orderedViewControllers.count > previousIndex else {
            return nil
        }

        return orderedViewControllers[previousIndex]
    }

    func pageViewController(_ pageViewController: UIPageViewController,
                            viewControllerAfter viewController: UIViewController) -> UIViewController? {
        guard let viewControllerIndex = orderedViewControllers.index(of: viewController) else {
            return nil
        }

        let nextIndex = viewControllerIndex + 1
        let orderedViewControllersCount = orderedViewControllers.count

        // User is on the last view controller and swiped right to loop to
        // the first view controller.
        guard orderedViewControllersCount != nextIndex else {
            return orderedViewControllers.first
        }

        guard orderedViewControllersCount > nextIndex else {
            return nil
        }

        return orderedViewControllers[nextIndex]
    }

}

extension PageViewController: UIPageViewControllerDelegate {

    func pageViewController(_ pageViewController: UIPageViewController,
                            didFinishAnimating finished: Bool,
                            previousViewControllers: [UIViewController],
                            transitionCompleted completed: Bool) {
        notifyPageDelegateOfNewIndex()
    }

}

protocol PageViewControllerDelegate: class {

    /**
     Called when the number of pages is updated.

     - parameter pageViewController: the PageViewController instance
     - parameter count: the total number of pages.
     */
    func pageViewController(pageViewController: PageViewController,
                            didUpdatePageCount count: Int)

    /**
     Called when the current index is updated.

     - parameter pageViewController: the PageViewController instance
     - parameter index: the index of the currently visible page.
     */
    func pageViewController(pageViewController: PageViewController,
                            didUpdatePageIndex index: Int)

}

Remove Black Edges from UIPageViewController in Swift 3

Answers (1)

Related Questions