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

如何仅移除NavigationSplitView详情区的工具栏?

问题

我想要将红色矩形垂直居中于NavigationSplitView的详情区域(右侧)。目前用.toolbarBackground(.hidden, for: .windowToolbar)只能隐藏工具栏背景,空间依然被占用;获取工具栏高度的方法又有其他弊端。请问有没有办法完全移除详情区的工具栏,同时保留侧边栏的工具栏?

截图

原代码:

NavigationSplitView {
    Color.orange
} detail: {
    Color.red
        .aspectRatio(18/9, contentMode: .fit)
    .toolbar(removing: .title)
    .toolbarBackground(.hidden, for: .windowToolbar)
}
解决方法

通过组合两个修饰符可以彻底移除详情区工具栏的空间,同时保留侧边栏的工具栏:

  • .toolbar(.hidden, for: .navigationBar):直接隐藏详情区的导航栏工具栏
  • .navigationBarTitleDisplayMode(.never):移除标题栏的占位空间,确保工具栏完全释放占用的区域

修改后的代码:

NavigationSplitView {
    Color.orange
} detail: {
    Color.red
        .aspectRatio(18/9, contentMode: .fit)
        .toolbar(.hidden, for: .navigationBar)
        .navigationBarTitleDisplayMode(.never)
}

修改后红色矩形会自动垂直居中于详情区域,因为原本工具栏占用的空间已被完全清除,视图布局将基于详情区的全部可用空间计算。

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

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.06.13 00:42:19