NavigationStack中.toolbar内容导航返回时被裁剪问题求助

问题现象 #

在iOS 17.2环境下，使用NavigationStack配合自定义.toolbar（指定placement: .principal的多行VStack内容）时，初始加载及导航push过渡过程中工具栏显示正常，但从子页面pop返回后，工具栏内容会出现裁剪。

代码分析 #

你提供的代码完全遵循官方文档构建视图层级，没有明显逻辑错误：

struct PlaygroundView: View {
    @State var destinations: [Color] = []
    
    var body: some View {
        NavigationStack(path: $destinations) {
            Color.blue
                .toolbar {
                    ToolbarItem(placement: .principal) {
                        VStack {
                            Text("First Line Title")
                                .font(.title)
                                .foregroundStyle(.primary)
                            Text("Second Line Subtitle")
                                .font(.title2)
                                .foregroundStyle(.secondary)
                        }
                    }
                }
                .navigationDestination(for: Color.self, destination: { color in
                    color
                })
                .onTapGesture {
                    destinations.append(.red)
                }
        }
    }
}

结论 #

这种情况大概率是iOS 17.2版本SwiftUI的Bug，属于NavigationStack与.principal位置自定义工具栏的交互问题，仅在pop返回后触发布局异常。

临时修复方案 #

可以通过以下方式规避该问题：

• 给工具栏内容设置最小高度：强制匹配导航栏的默认布局高度，避免返回后系统错误计算可用空间

ToolbarItem(placement: .principal) {
    VStack(spacing: 4) {
        Text("First Line Title")
            .font(.title)
            .foregroundStyle(.primary)
        Text("Second Line Subtitle")
            .font(.title2)
            .foregroundStyle(.secondary)
    }
    .frame(minHeight: 44) // 固定最小高度，适配导航栏默认尺寸
}

• 改用navigationTitle承载多行内容：利用系统原生标题布局逻辑，避免自定义Toolbar的兼容性问题

.navigationTitle {
    VStack(spacing: 4) {
        Text("First Line Title")
            .font(.title)
            .foregroundStyle(.primary)
        Text("Second Line Subtitle")
            .font(.title2)
            .foregroundStyle(.secondary)
    }
}

内容的提问来源于stack exchange，提问作者olx