【iOS】UIPageViewController使用

😁这篇拙文会为小白选手简单介绍下UIPageViewController的使用😁

iPad-竖屏 iPad-横屏

手机横竖屏都只支持单页 【也可以自己定制支持双页】

1 创建ModelController.swift

提供上下页的已经绑定了数据的展示vc，实现UIPageViewControllerDataSource协议

class ModelController: NSObject, UIPageViewControllerDataSource {
// 数据源数组
var pageData: [String] = []
// 注意pageData的数据一定要是偶数个，不然如果你设置了横屏双页显示，就会奔溃

    override init() {
        super.init()
        // Create the data model.
        let dateFormatter = NSDateFormatter()
        pageData = dateFormatter.shortWeekdaySymbols //必须是双数
        if pageData.count%2 != 0 {
            pageData.append("No More Pages") //提示信息，也可以为空内容
        }
    }

// 实现协议方法
// MARK: - Page View Controller Data Source

// 上一页
    func pageViewController(pageViewController: UIPageViewController, 
viewControllerBeforeViewController 
viewController: UIViewController) -> UIViewController? {
        var index = self.indexOfViewController(viewController as! DataViewController)
        if (index == 0) || (index == NSNotFound) {
            return nil
        }
        
        index -= 1
        return self.viewControllerAtIndex(index, storyboard: viewController.storyboard!)
    }

// 下一页
    func pageViewController(pageViewController: UIPageViewController, viewControllerAfterViewController viewController: UIViewController) -> UIViewController? {
        var index = self.indexOfViewController(viewController as! DataViewController)
        if index == NSNotFound {
            return nil
        }
        
        index += 1
        if index == self.pageData.count {
            return nil
        }
        return self.viewControllerAtIndex(index, storyboard: viewController.storyboard!)
    }
}

// 私有方法

private func viewControllerAtIndex(index: Int, storyboard: UIStoryboard) -> DataViewController? {
        // 返回要展示的controller
        if (self.pageData.count == 0) || (index >= self.pageData.count) {
            return nil
        }

        // 创建controller并绑定数据
        let dataViewController = storyboard.instantiateViewControllerWithIdentifier("DataViewController") as! DataViewController
        dataViewController.dataObject = self.pageData[index]
        return dataViewController
    }

// 返回当前controller的index，便于上下页时计算使用
    private func indexOfViewController(viewController: DataViewController) -> Int {
        return pageData.indexOf(viewController.dataObject) ?? NSNotFound
    }

2 创建DataViewController.swift

为真正展示用的vc

import UIKit

class DataViewController: UIViewController {

// 就绑定一个label用于展示简单内容
    @IBOutlet weak var dataLabel: UILabel!
// 当前页的数据
    var dataObject: String = ""

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

// 建议在这里刷新显示数据
    override func viewWillAppear(animated: Bool) {
        super.viewWillAppear(animated)
        self.dataLabel!.text = dataObject
    }

}

3 使用

// .PageCurl翻页样式
self.pageViewController = UIPageViewController(transitionStyle: .PageCurl, navigationOrientation: .Horizontal, options: nil)
// 实现代理方法 - 动态设置书脊的位置，以及横竖屏的显示页数【单双页】
        self.pageViewController!.delegate = self

// 开始展示的最初页
        let startingViewController: DataViewController = self.modelController.viewControllerAtIndex(0, storyboard: self.storyboard!)!
        let viewControllers = [startingViewController]
        self.pageViewController!.setViewControllers(viewControllers, direction: .Forward, animated: false, completion: {done in })

        self.pageViewController!.dataSource = self.modelController

        self.addChildViewController(self.pageViewController!)
        self.view.addSubview(self.pageViewController!.view)

        self.pageViewController!.didMoveToParentViewController(self)

实现代理方法 - UIPageViewControllerDelegate

func pageViewController(pageViewController: UIPageViewController, spineLocationForInterfaceOrientation orientation: UIInterfaceOrientation) -> UIPageViewControllerSpineLocation {
        if (orientation == .Portrait) || (orientation == .PortraitUpsideDown) || (UIDevice.currentDevice().userInterfaceIdiom == .Phone) {
            // In portrait orientation or on iPhone: Set the spine position to "min" and the page view controller's view controllers array to contain just one view controller. Setting the spine position to 'UIPageViewControllerSpineLocationMid' in landscape orientation sets the doubleSided property to true, so set it to false here.
            let currentViewController = self.pageViewController!.viewControllers![0]
            let viewControllers = [currentViewController]
            self.pageViewController!.setViewControllers(viewControllers, direction: .Forward, animated: true, completion: {done in })

            self.pageViewController!.doubleSided = false
// 单页显示，书脊在最左边
            return .Min
        }

        let currentViewController = self.pageViewController!.viewControllers![0] as! DataViewController
        var viewControllers: [UIViewController]

        let indexOfCurrentViewController = self.modelController.indexOfViewController(currentViewController)
// 横屏或双数index时，说明当前是左边第一页，需要展示下一页以达到双页展示效果
        if (indexOfCurrentViewController == 0) || (indexOfCurrentViewController % 2 == 0) {
            let nextViewController = self.modelController.pageViewController(self.pageViewController!, viewControllerAfterViewController: currentViewController)
            viewControllers = [currentViewController, nextViewController!]
        } else {
            let previousViewController = self.modelController.pageViewController(self.pageViewController!, viewControllerBeforeViewController: currentViewController)
            viewControllers = [previousViewController!, currentViewController]
        }
        self.pageViewController!.setViewControllers(viewControllers, direction: .Forward, animated: true, completion: {done in })

// 双页显示，书脊位置在中间
        return .Mid
    }

4 说了这么半天，其实对小白来说，下面一张截图就搞定，然后慢慢研究怎么用吧😁，苹果为我们提供的template里就有现成的

Command+Shift+N