How to add a background video view behind a UIPageViewController?

Question

I have a login flow that has a video playing in the background, and pages of text on top of that fixed video, and the final page is the login form.

I've managed to build the page scroll, but each page has its own background and I'm kinda lost to find out how to make a view fixed with a looping video on bg, and transparent pages scrolling horizontally on top of that.

UPDATE

My storyboard is like this: And my BootViewController is implementing page handlers.

import UIKit

class BootViewController: UIPageViewController, UIPageViewControllerDataSource {

override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent
}

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view.

    dataSource = self

    setViewControllers([UIStoryboard(name: "Boot", bundle: nil).instantiateViewController(withIdentifier: pages[0])], direction: .forward, animated: true, completion: nil)

}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}

let pages = [
    "IntroPageOne",
    "IntroPageTwo",
    "LoginController"
]

func pageViewController(_ pageViewController: UIPageViewController, viewControllerBefore viewController: UIViewController) -> UIViewController? {

    let currentViewControllerIdentifier = viewController.restorationIdentifier

    var previousViewController = pages.index(of: currentViewControllerIdentifier!)! - 1

    if previousViewController < 0 {
        previousViewController = pages.count - 1
    }

    let previousViewControllerIdentifier = pages[previousViewController]


    return UIStoryboard(name: "Boot", bundle: nil).instantiateViewController(withIdentifier: previousViewControllerIdentifier)
}

func pageViewController(_ pageViewController: UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? {

    let currentViewControllerIdentifier = viewController.restorationIdentifier

    var nextViewController = pages.index(of: currentViewControllerIdentifier!)! + 1

    if nextViewController < 0 {
        nextViewController = 0
    }

    if nextViewController >= pages.count {
        nextViewController = 0
    }

    let nextViewControllerIdentifier = pages[nextViewController]


    return UIStoryboard(name: "Boot", bundle: nil).instantiateViewController(withIdentifier: nextViewControllerIdentifier)
}
}

I'm lost on how to create a subview and add (link) to my bootController.

Answer 1

Did you just try the following setup?

UIViewController.view
  - backgroundVideoView
  - pageViewController.view
     - page1
     - page2
     ...

In this you add a background video view as a bottom view in view.subviews, and then you add a view of a pageViewController above it. All that you would need is to set pageViewController.view.backgroundColor = UIColor.clear and page1.view.backgroundColor = UIColor.clear, etc., to make sure that the background is visible.

UPDATE

In your case, maybe something like this will be ok:

class BackgroundViewController: UIViewController {

    fileprivate var pageViewController: BootViewController!

    override func viewDidLoad() {
        super.viewDidLoad()

        // configure here anything with the video that you have to configure

        pageViewController = UIStoryboard(name: "Boot", bundle: nil).instantiateViewController(withIdentifier: "BootViewController") as! BootViewController
        self.view.addSubview(pageViewController.view)

        // set the frame, or use autolayout.. I will set the frame directly since it's easier here
        pageViewController.view.frame = self.view.frame
    }
}

There is no "backgroundView" of the UIPageViewController. To get something similar, you will use a different view controller to which you can include the view of your UIPageViewController. Then this parent view controller can become the background, and the page controller the foreground (because it is added as a topmost subview of the viewController).