SwiftUI问题：NavigationTitle搭配List与搜索框时显示异常

你遇到的这个搜索栏对齐异常，是SwiftUI旧版NavigationView在处理嵌套导航栈中多个.searchable修饰符时的典型布局Bug，不少开发者都反馈过类似问题。

问题复现的核心原因 #

当导航栈里同时存在多个带.searchable的视图（首页列表+子页面列表）时，SwiftUI的导航栏布局状态在页面返回后没有正确重置：

• 首次进入首页下拉搜索栏，布局约束计算出错，导致搜索框和导航标题、列表无法对齐
• 进入子页面下拉搜索栏后，布局状态被正确初始化，返回首页后暂时恢复正常，但再次下拉时又会触发错误的约束计算

你提供的代码完全可以稳定复现这个问题——在默认的Core Data项目中替换NavigationView代码后，就能看到你描述的异常表现。

解决方法 #

根据你的iOS版本需求，有几种可行的修复方案：

1. 升级到NavigationStack（推荐，iOS 16+）

Apple在iOS 16推出的新导航API NavigationStack 修复了大量旧NavigationView的布局Bug，包括这类搜索栏对齐问题。把你的代码改成如下形式即可：

NavigationStack {
    List {
        ForEach(items) { item in
            NavigationLink(
                destination: {
                    List{}
                        .searchable(text: $text)
                        .navigationTitle("Test")
                },
                label: {
                    Text(item.timestamp!, formatter: itemFormatter)
                }
            )
        }
        .onDelete(perform: deleteItems)
    }
    .searchable(text: $text)
    .navigationTitle("Title")
    .toolbar {
        ToolbarItem(placement: .navigationBarTrailing) {
            EditButton()
        }
        ToolbarItem {
            Button(action: addItem) {
                Label("Add Item", systemImage: "plus")
            }
        }
    }
}

如果想更贴合新API的设计，还可以使用navigationDestination来定义跳转目标，进一步优化布局稳定性。

2. 兼容iOS 15及以下的临时修复

如果必须支持旧系统，可以尝试在首页的onAppear中强制触发布局重置，让搜索栏的约束重新计算：

List {
    // 原有列表内容
}
.searchable(text: $text)
.navigationTitle("Title")
.onAppear {
    // 通过临时修改搜索文本触发绑定更新，带动布局重置
    DispatchQueue.main.async {
        let tempText = text
        text = ""
        text = tempText
    }
}

这个方法利用SwiftUI的绑定更新机制，强制让搜索栏的布局状态重新初始化，能缓解大部分场景下的对齐问题。

总结 #

这个问题不属于代码编写错误，是SwiftUI旧版导航组件的设计缺陷。优先推荐使用NavigationStack来彻底解决，如果需要兼容旧版本，可以尝试上述临时修复方案。

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