iOS - 自由控制页面横竖屏展示

有些时候我们需要用特定方向展示某些页面(例如固定横屏展示),而不影响其它页面。例如一些 app 固定用横屏播放视频。这种情况下,我们就需要在代码中控制。

注:所有代码均使用 Swift 4.0

要点

  1. 涉及的 view controller 属性:shouldAutorotate, supportedInterfaceOrientations, preferredInterfaceOrientationForPresentation
  2. info.plistDevice Orientation 需要把所有会在 app 里出现的页面方向选上,如下图:
info.plist 里的 Device Orientation
  1. 当使用 container controller (UITabBarController, UINavigationController)包裹 view controller 时,系统通过查询 container controller 的
    supportedInterfaceOrientationsshouldAutorotate 属性来决定方向
    • 注意:在 navigation controller push/pop view controller,或在 tab bar controller 里改变 selected view controller时,不应该改变 view controller 的页面方向。因为前后 view controller 页面方向不同的话,会出现不连贯的奇怪过场动画,更重要的是也不符合 container controller 的使用标准。下面会用例子说明。
  2. present view controller 时,系统则通过查询 presented view controller 的 supportedInterfaceOrientations, shouldAutorotate, preferredInterfaceOrientationForPresentation 三个属性来决定方向

官方文档解释

在看代码之前,需要先了解这三个属性的定义。

  • shouldAutorotate: Bool 类型的属性,决定能否切换页面方向。默认情况下返回 true, 需要配合着 supportedInterfaceOrientations 使用,看条目 supportedInterfaceOrientations 的解释。

  • supportedInterfaceOrientations: bit mask 类型的属性,Swift 下可以使用 UIInterfaceOrientation enum 值的 Set 表示。使用情景是当系统检测到设备方向改变时,会访问 container controllerpresented view controller 的这个属性来获取目前所支持的页面方向,当返回值包括设备新的页面方向时,系统会继续访问 shouldAutorotate 来决定是否旋转页面;当返回值不包括时,系统则不会继续访问 shouldAutorotate

  • preferredInterfaceOrientationForPresentation: UIInterfaceOrientation enum 类型的属性,当在 full screen 下 present view controller 时,系统访问此属性来决定 presented view controller 的页面方向。这里要注意两点:

    1. 只有在 modalPresentationStylefull screen 时才适用,其它 style 下不会被访问
    2. preferredInterfaceOrientationForPresentation 必须是 supportedInterfaceOrientations 的子集,否则当 present 此页面时 app 会强退

单纯文字太抽象,以下通过代码来详细描述各个情况下的设定。所有代码均使用 Swift 4 书写,如果是 Objective-C, override 相应方法即可。

使用 container controller 的例子

例子使用 tab bar controller -> navigation controller -> view controller 的层级结构:

view controller 结构

根据所在页面控制是否跟随设备方向来改变页面方向的效果:

在 container controller 里控制页面方向

实现思路是,在所有 container 里实现 shouldAutorotatesupportedInterfaceOrientations,返回展示的最上层的 view controller 的设置。
在 tabbar controller 里:

    override var shouldAutorotate: Bool {
        return selectedViewController?.shouldAutorotate ?? false
    }
    
    override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
        return selectedViewController?.supportedInterfaceOrientations ?? .portrait
    }

在 navigation controller 里:

    override var shouldAutorotate: Bool {
        return topViewController?.shouldAutorotate ?? false
    }
    
    override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
        return topViewController?.supportedInterfaceOrientations ?? .portrait
    }

因此在 view controller 里就可以返回需要的值来决定起页面方向配置。

注意:不建议在同一个 container controller 里前后 view controller 方向不一致的设定,否则会出现不对称的过场动画。
如下例子是竖屏 push横屏 pop 后,下次竖屏 push 完后的竖屏 pop 动画还是会和横屏 pop 一样:

依旧是横屏 pop 的过场动画

目前我知道的解决办法是:在可以变换页面方向的 view controller 里换回竖屏 pop。

Present 例子

Present view controller 相对来说自由很多,个人认为是因为这种方式无论是相互关系和 UI 关联性都比较独立于 container controller。你可以 present 任意方向的 view controller,同时 dismiss 时的方向也不会影响下次 present 后的 dismiss 方向。
一个固定 landscapeLeft present 的例子:

固定 landscapeLeft present

present 需要在 presented view controller 里实现三个属性:

    override var shouldAutorotate: Bool {
        return false
    }
    
    override var preferredInterfaceOrientationForPresentation: UIInterfaceOrientation {
        return .landscapeLeft
    }
    
    override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
        return .landscapeLeft
    }

上文提过,present 的这种使用需要 modalPresentationStylefull screenpreferredInterfaceOrientationForPresentation 必须是 supportedInterfaceOrientations 的子集。

同时这里多实现的 preferredInterfaceOrientationForPresentation 是用于控制 presented view controller 出现时的方向。无论设备或者 presenting view controller 是什么方向,presented view controller 的方向都会根据此属性来设置。

总结

  • view controller 的页面横竖屏通过三个属性控制:shouldAutorotatepreferredInterfaceOrientationForPresentationsupportedInterfaceOrientations
  • info.plistDevice Orientation 需要包括 app 里所有可能出现的页面方向
  • 当使用 container controller 时,系统通过调用 container controller 的 shouldAutorotatesupportedInterfaceOrientations 来决定方向
    • container controller 里的前后 view controllers 的方向建议保持一致
  • 当 present view controller 时,系统通过调用presented view controllershouldAutorotatepreferredInterfaceOrientationForPresentationsupportedInterfaceOrientations 来决定方向

欢迎任何意见交流 :)
实例项目请点 这里

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容