SwiftUI NavigationStack返回父视图时标题动画异常问题

我在开发SwiftUI页面时遇到一个问题：父视图的NavigationStack使用.large大标题模式，子视图用.inline行内标题模式，从子视图返回父视图时，父标题会短暂变成行内样式，半秒后才跳回大标题位置。

父视图代码：

struct TeamsView: View {
    var body: some View {
        NavigationStack {
            List {
                Section {
                    NavigationLink {
                        ChildView()
                    } label: {
                        Text("Test")
                    }
                }
            }
            .navigationTitle("Title 1")
            .navigationBarTitleDisplayMode(.large)
        }
    }
}

子视图代码：

struct ChildView: View {
    var body: some View {
         List {
              Section {
                  //...
              }
              Section {
                  //...
              }
         }
         .navigationTitle("Title 2")
         .navigationBarTitleDisplayMode(.inline)
     }
}

问题表现：

我已经在模拟器、真机测试过，调整标题的应用位置也没用，求解决办法。

可行解决方案 #

方案1：调整父视图标题设置的层级 #

把父视图的.navigationTitle和.navigationBarTitleDisplayMode直接绑定到NavigationStack本身，而不是内部的List上，让导航栈的标题配置优先级更高：

struct TeamsView: View {
    var body: some View {
        NavigationStack {
            List {
                Section {
                    NavigationLink {
                        ChildView()
                    } label: {
                        Text("Test")
                    }
                }
            }
        }
        .navigationTitle("Title 1")
        .navigationBarTitleDisplayMode(.large) // 移到NavigationStack外层
    }
}

方案2：用显式路径管理替代隐式NavigationLink #

通过NavigationPath控制导航状态，避免隐式链接带来的状态冲突：

struct TeamsView: View {
    @State private var path = NavigationPath()
    
    var body: some View {
        NavigationStack(path: $path) {
            List {
                Section {
                    Button("Test") {
                        path.append(())
                    }
                }
            }
            .navigationTitle("Title 1")
            .navigationBarTitleDisplayMode(.large)
            .navigationDestination(for: Void.self) {
                ChildView(path: $path)
            }
        }
    }
}

struct ChildView: View {
    @Binding var path: NavigationPath
    
    var body: some View {
         List {
              Section {
                  //...
              }
              Section {
                  //...
              }
         }
         .navigationTitle("Title 2")
         .navigationBarTitleDisplayMode(.inline)
         .toolbar {
             ToolbarItem(placement: .navigationBarLeading) {
                 Button("返回") {
                     path.removeLast()
                 }
             }
         }
     }
}

方案3：强制父视图保持大标题模式 #

利用onAppear在父视图每次出现时，通过UIKit API强制开启大标题，覆盖残留的状态：

struct TeamsView: View {
    var body: some View {
        NavigationStack {
            List {
                Section {
                    NavigationLink {
                        ChildView()
                    } label: {
                        Text("Test")
                    }
                }
            }
            .navigationTitle("Title 1")
            .navigationBarTitleDisplayMode(.large)
            .onAppear {
                UINavigationBar.appearance().prefersLargeTitles = true
            }
        }
    }
}

注意：方案3是全局设置，如果其他页面不需要大标题，要在对应页面的onAppear里把prefersLargeTitles设回false。

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