带有 navigationLink 的 SwiftUI 消失后退按钮

Posted 2023-02-24

【中文标题】带有 navigationLink 的 SwiftUI 消失后退按钮

【英文标题】：SwiftUI disappear back button with navigationLink

【发布时间】：2021-04-27 19:24:35

【问题描述】：

我有 3 个视图。其中一个有 NavigationView，第二个有 NavigationLink，最后一个只是带有工具栏的子项。

所以当我在最后一个视图中添加工具栏时我的问题 backButton 优雅消失了。我该如何解决这个问题？

Screen recording of my problem

import SwiftUI

struct ContentView: View 
    var body: some View 
        NavigationView 
            VStack 
                Text("Hello, world!")
                    .padding()
                NavigationLink(destination: ListView()) 
                    
                    Image(systemName: "trash")
                        .font(.largeTitle)
                        .foregroundColor(.red)
                
            .navigationBarHidden(true)
            .navigationTitle("Image")
        
    

---

import SwiftUI

struct ListView: View 
    @Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>

    var body: some View 
        VStack 
            List 
                NavigationLink(destination: DetailView()) 
                    Text("Detail")
                
            
            
        .navigationBarTitle(Text("Data"), displayMode: .large)
        .toolbar 
            Button("Save") 
                presentationMode.wrappedValue.dismiss()
            
        
    

---

import SwiftUI

struct DetailView: View 
    @Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
    var body: some View 
        
        VStack 
            Text("DetailView")
                .padding()
        .navigationBarTitle(Text("Data"), displayMode: .large)
        .toolbar 
            Button("Save") 
                presentationMode.wrappedValue.dismiss()
            
        
    

【参考方案1】：

在控制台中，您会注意到以下消息：

2021-04-27 12:37:36.862733-0700 MyApp[12739:255441] [Assert] displayModeButtonItem 是内部管理的，不会针对 DoubleColumn 样式公开。返回一个空的、断开连接的 UIBarButtonItem 以履行非空合同。

NavigationView 的默认样式通常为DefaultNavigationViewStyle、which is really just DoubleColumnNavigationViewStyle。请改用StackNavigationViewStyle，它按预期工作。

编辑：你说得对，StackNavigationViewStyle 会破坏 iPad 拆分视图。但幸运的是，DoubleColumnNavigationViewStyle 在 iPad 上运行良好，并且不会隐藏后退按钮。然后我们可以根据设备使用不同的NavigationStyle，如this answer所示。

struct ResponsiveNavigationStyle: ViewModifier 
    @Environment(\.horizontalSizeClass) var horizontalSizeClass

    @ViewBuilder
    func body(content: Content) -> some View 
        if horizontalSizeClass == .compact  /// iPhone
            content.navigationViewStyle(StackNavigationViewStyle())
         else  /// iPad or larger iPhone in landscape
            content.navigationViewStyle(DoubleColumnNavigationViewStyle())
        
    


struct ContentView: View 
    var body: some View 
        NavigationView 
            VStack 
                Text("Hello, world!")
                    .padding()
                NavigationLink(destination: ListView()) 
                    
                    Image(systemName: "trash")
                        .font(.largeTitle)
                        .foregroundColor(.red)
                
            
            .navigationBarHidden(true)
            .navigationTitle("Image")
        
        .modifier(ResponsiveNavigationStyle()) /// here!
    

结果：

iPad	iPhone

【讨论】：

.navigationViewStyle(StackNavigationViewStyle()) 但 iPAD 拆分视图损坏，所以我认为是不好的解决方案

我喜欢这个答案，@aheze - 谢谢。 （但我已经让自己定期检查是否仍然需要它！）