iPhoneX状态栏与导航栏显示异常及About控制器适配求助

嘿，这个iPhone X横屏的适配坑我之前踩过，给你几个亲测有效的解决方案：

1. 修正导航栏的延伸布局属性 #

iPhone X及后续全面屏设备的安全区域机制是关键，你需要确保导航栏能正确延伸到屏幕边缘，同时让控制器的布局和导航栏联动。在你的About控制器的viewDidLoad方法里添加这些代码：

Swift 版本 #

override func viewDidLoad() {
    super.viewDidLoad()
    // 关闭大标题（如果不需要的话）
    navigationController?.navigationBar.prefersLargeTitles = false
    // 禁用导航栏半透明，确保背景色完全覆盖
    navigationController?.navigationBar.isTranslucent = false
    // 允许不透明导航栏时布局延伸
    navigationController?.extendedLayoutIncludesOpaqueBars = true
    // 设置控制器边缘布局延伸方向为全方向
    edgesForExtendedLayout = .all
    // 同步View背景色和导航栏一致
    view.backgroundColor = navigationController?.navigationBar.backgroundColor
}

Objective-C 版本 #

- (void)viewDidLoad {
    [super viewDidLoad];
    self.navigationController.navigationBar.prefersLargeTitles = NO;
    self.navigationController.navigationBar.translucent = NO;
    self.navigationController.extendedLayoutIncludesOpaqueBars = YES;
    self.edgesForExtendedLayout = UIRectEdgeAll;
    self.view.backgroundColor = self.navigationController.navigationBar.backgroundColor;
}

这段代码会让导航栏在横屏时自动延伸到屏幕两侧，同时状态栏的背景会和导航栏保持一致，不会出现白色断层。

2. 单独处理状态栏背景（兜底方案） #

如果上面的方法还是没解决，你可以直接给状态栏区域添加一个同色的背景View，强制覆盖状态栏的白色背景：

Swift 版本（适配iOS 13+） #

override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)
    guard let statusBarFrame = view.window?.windowScene?.statusBarManager?.statusBarFrame else { return }
    let statusBarBgView = UIView(frame: statusBarFrame)
    statusBarBgView.backgroundColor = navigationController?.navigationBar.backgroundColor
    statusBarBgView.tag = 999 // 标记tag方便后续移除
    view.addSubview(statusBarBgView)
}

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)
    // 移除状态栏背景View，避免内存泄漏
    view.viewWithTag(999)?.removeFromSuperview()
}

3. 检查模态展示样式 #

如果你的About控制器是通过模态方式弹出的，一定要确认它的modalPresentationStyle不是pageSheet或formSheet——这两种样式在iPhone X横屏时会强制保留侧边空白，导致导航栏无法延伸。改成全屏展示即可：

Swift 版本 #

let aboutVC = AboutViewController()
aboutVC.modalPresentationStyle = .fullScreen
present(aboutVC, animated: true)

4. 避免自定义导航栏干扰 #

如果你给导航栏设置了自定义背景图片或阴影效果，要确保这些资源适配了全面屏的安全区域。比如自定义背景图片时，要预留顶部的安全区域高度，或者用代码动态调整背景图片的布局，避免覆盖或留白异常。

内容的提问来源于stack exchange，提问作者Adam C.