SwiftUI：NavigationStack根视图无标题时Push详情页导航栏无动画

当NavigationStack的根视图未设置导航标题（或标题为空）时，推送Detail View过程中导航栏不会出现过渡动画。而使用旧版NavigationView时，该动画表现正常。

复现代码 #

//
//  ContentView.swift
//  iTestNavStackFresh
//
//  Created by Aleksandar Petrov on 6.04.23.
//

import SwiftUI

enum NavigationRoute {
    case details
}

struct ContentView: View {
    @State private var navigationPath = NavigationPath()

    var body: some View {
        NavigationStack(path: $navigationPath) {
            Button("Go to Details View") {
                navigationPath.append(NavigationRoute.details)
            }
            // .navigationTitle("ANY NON EMPTY TITLE WILL DO") // <-- 取消注释即可修复问题
            // .navigationBarTitleDisplayMode(.inline)
            .navigationDestination(for: NavigationRoute.self) { navigationRoute in
                switch navigationRoute {
                case .details:
                    DetailView()
                        .toolbarBackground(Color.white, for: .navigationBar)
                        .toolbarBackground(.visible, for: .navigationBar)
                }
            }
        }
    }
}

struct DetailView: View {
    var body: some View {
        Text("Detail View")
            .font(.title)
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .background(
                Color.black
                    .opacity(0.3)
            )
            .navigationTitle("Detail View")
            .navigationBarTitleDisplayMode(.inline)
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

测试环境 #

• iPhone 11 Pro（iOS 16.4）
• iPhone 12（iOS 16.1.1）

使用NavigationView的正常表现代码 #

//
//  ContentView.swift
//  iTestNavStackFresh
//
//  Created by Aleksandar Petrov on 6.04.23.
//

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            NavigationLink(
                destination: DetailView()
                    .toolbarBackground(Color.white, for: .navigationBar)
                    .toolbarBackground(.visible, for: .navigationBar)
            ) {
                Text("Hello, World!")
            }
        }
    }
}

struct DetailView: View {
    var body: some View {
        Text("Detail View")
            .navigationTitle("Detail View")
            .navigationBarTitleDisplayMode(.inline)
            .font(.title)
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .background(
                Color.black
                    .opacity(0.3)
            )
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

临时修复方案 #

给NavigationStack的根视图设置任意非空导航标题（哪怕是空白字符），就能恢复导航栏的推送动画。示例代码中取消注释对应的两行即可，也可以简化为：

.navigationTitle(" ")
.navigationBarTitleDisplayMode(.inline)

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