You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

iOS中如何将自定义Xib视图替换为导航栏(视图高度大于默认值)

替换导航栏为自定义视图(含高度适配)

方法一:隐藏系统导航栏,直接添加自定义视图

这是适配复杂布局最灵活的方案:

  1. 隐藏系统导航栏
    在目标视图控制器的viewDidLoad中添加代码:

    navigationController?.setNavigationBarHidden(true, animated: false)
    

    也可以直接在Storyboard中勾选导航控制器的「Hide Navigation Bar」选项。

  2. 添加自定义视图并约束
    初始化你的自定义导航栏(比如CustomNavBar),用Auto Layout固定在视图顶部并设置高度:

    let customNavBar = CustomNavBar()
    customNavBar.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(customNavBar)
    
    NSLayoutConstraint.activate([
        customNavBar.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
        customNavBar.leadingAnchor.constraint(equalTo: view.leadingAnchor),
        customNavBar.trailingAnchor.constraint(equalTo: view.trailingAnchor),
        customNavBar.heightAnchor.constraint(equalToConstant: 80) // 替换为你的自定义高度
    ])
    

    若页面有滚动视图(如UITableView),需调整其contentInset或约束,避免内容被自定义导航栏遮挡。

  3. 处理交互逻辑
    自定义视图内的返回按钮、操作按钮等交互,可直接在CustomNavBar内部实现,或通过代理/闭包通知视图控制器处理页面跳转。

方法二:修改系统导航栏高度并设置自定义titleView

如果想保留系统导航栏的部分特性(如默认返回按钮),可采用此方案:

  1. 自定义导航控制器重写高度
    创建自定义导航控制器类,重写导航栏高度属性(iOS 11+支持):

    class CustomNavController: UINavigationController {
        override var preferredNavigationBarHeight: CGFloat {
            return 80 // 自定义高度
        }
    }
    

    将项目中的导航控制器替换为这个自定义类。

  2. 设置自定义视图为titleView
    在目标视图控制器的viewDidLoad中配置:

    let customNavBar = CustomNavBar()
    customNavBar.frame = CGRect(x: 0, y: 0, width: view.frame.width, height: 80)
    navigationItem.titleView = customNavBar
    

    需保证自定义视图高度和导航栏调整后的高度一致,避免内容被裁剪。

注意事项

  • 安全区适配:自定义导航栏顶部约束要绑定safeAreaLayoutGuide,或手动加上刘海屏/动态岛的安全区高度,避免内容被遮挡。
  • 全局复用:若所有页面都需使用该自定义导航栏,建议创建基类视图控制器,在基类中完成自定义视图的添加与配置,其他控制器直接继承即可。
  • 转场动画:方法二更易保留系统导航转场动画;方法一若需转场动画,需自行处理视图过渡逻辑。

内容的提问来源于stack exchange,提问作者Faheem Rahman

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.21 16:04:59