UISplitViewController 安全区域扩展问题解析及解决方案

2024-11-10 23:10:39

UISplitViewController 在 iPad 应用开发中扮演着重要角色，它能够优雅地展示和管理多个视图控制器。然而，开发者有时会遇到安全区域被意外扩展的问题，这会导致次级视图（Secondary View）的内容被主视图（Primary View）的导航栏向下偏移。本文将深入探讨这一问题的成因并提供解决方案。

问题

当 UISplitViewController 的主视图是一个导航控制器时，次级视图的安全区域顶部会向下偏移，偏移量与主视图导航栏的高度相同。这会导致次级视图的内容，例如导航栏或其他顶部布局元素，无法正确地贴合屏幕边缘，如下图所示：

观察视图调试器可以发现，UISplitViewController 会将次级视图嵌入到一个 UINavigationController 中，而正是这个导航控制器导致了安全区域的偏移。

问题根源

UISplitViewController 的这种行为并非 bug，而是其默认的布局机制。在某些情况下，系统会自动为次级视图添加一个导航控制器，以便在折叠状态下提供返回主视图的按钮。即使次级视图本身已经包含一个导航控制器，系统仍然会添加这个额外的导航控制器，从而导致安全区域向下偏移。

解决方案

针对这个问题，主要有以下两种解决方案：

1. 避免在次级视图中嵌套导航控制器:

最简单的解决方案是直接在次级视图控制器中管理视图层级，避免嵌套 UINavigationController。如果需要导航功能，可以直接使用 navigationItem 属性来配置标题、按钮等元素。

操作步骤:

移除次级视图中的 UINavigationController。
直接在次级视图控制器中设置 navigationItem 的属性。

代码示例:

class SecondaryViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .lightGray
        
        let label = UILabel()
        label.translatesAutoresizingMaskIntoConstraints = false
        label.text = "Top"
        view.addSubview(label)
        label.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
        label.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor).isActive = true
        
        navigationItem.title = "Navigation Bar" 
    }
}

2. 自定义 UISplitViewController 的 preferredDisplayMode 属性:

可以设置 UISplitViewController 的 preferredDisplayMode 属性，来控制其显示模式，避免系统自动添加导航控制器。例如，将其设置为 .oneBesideSecondary 或 .oneOverSecondary。

操作步骤:

在创建 UISplitViewController 后，设置其 preferredDisplayMode 属性。

代码示例:

let splitViewController = UISplitViewController(style: .doubleColumn)
splitViewController.preferredDisplayMode = .oneBesideSecondary // 或 .oneOverSecondary

let primaryViewController = UINavigationController(rootViewController: PrimaryViewController())
let secondaryViewController = SecondaryViewController() 

splitViewController.setViewController(primaryViewController, for: .primary)
splitViewController.setViewController(secondaryViewController, for: .secondary)

// 设置 window 的 rootViewController
window?.rootViewController = splitViewController
window?.makeKeyAndVisible()