SwiftUI - 从子视图转换回主视图后删除导航栏中的额外空间答案

【问题标题】：SwiftUI - Remove extra space in NavigationBar after transitioning back to Home view from subviewSwiftUI - 从子视图转换回主视图后删除导航栏中的额外空间
【发布时间】：2021-12-17 11:32:17
【问题描述】：

我是 SwiftUI 新手，遇到了一些挑战。每当我从主视图转到子视图然后返回主视图时，我都会看到在导航视图中创建了额外的空间（参见链接的 GIF）。我想知道是否有人有任何建议 - 在此先感谢！

这是主屏幕：

struct Home: View {

@State private var view2 = false

var body: some View {
    NavigationView {
        VStack {
            Text("Home View!")
                .padding()
            
            NavigationLink(destination: View2(), isActive: $view2) { }
            
            Button {
                self.view2 = true
            } label: {
                Text("Go to next view")
            }
            
        }
        .navigationTitle("Home")
        
    }
    
} }

这是子新的（View2）：

struct View2: View {

@State private var home = false

var body: some View {
    VStack {
        Text("This is View 2")
            .padding()
        
        NavigationLink(destination: Home().navigationBarBackButtonHidden(true), isActive: $home) { }
        
        Button {
            self.home = true
        } label: {
            Text("Go to Home view")
        }
        
    }
    .navigationTitle("View 1")
} }

GIF 链接： Visual GIF of the issue

【问题讨论】：

欢迎来到 StackOverflow！检查以确保层次结构中没有多个 NavigationViews。

标签： ios swift swiftui swiftui-navigationview

【解决方案1】：

每次通过NavigationLink 推送新的Home 时，都会向层次结构中添加另一个NavigationView，因为Home 中包含NavigationView。

为避免这种情况，您可以将NavigationView 分开，而是链接到View：

struct Home: View {
    var body: some View {
        NavigationView {
            View1() //<-- Here
        }
    }
}

struct View1 : View {
    @State private var view2 = false
    
    var body: some View {
        VStack {
            Text("Home View!")
                .padding()
            
            NavigationLink(destination: View2(), isActive: $view2) { }
            
            Button {
                self.view2 = true
            } label: {
                Text("Go to next view")
            }
            
        }
        .navigationTitle("Home")
    }
}

struct View2: View {
    
    @State private var home = false
    
    var body: some View {
        VStack {
            Text("This is View 2")
                .padding()
            
            NavigationLink(destination: View1() //<-- Here
.navigationBarBackButtonHidden(true), isActive: $home) { }
            
            Button {
                self.home = true
            } label: {
                Text("Go to Home view")
            }
            
        }
        .navigationTitle("View 2")
    }
}

话虽如此，我对这里的策略有点怀疑。它似乎不像推送一个新View1，你可能只想返回到现有的。在这种情况下，您的代码可能如下所示：

struct Home: View {
    var body: some View {
        NavigationView {
            View1()
        }
    }
}

struct View1 : View {
    @State private var view2 = false
    
    var body: some View {
        VStack {
            Text("Home View!")
                .padding()
            
            NavigationLink(destination: View2(), isActive: $view2) { }
            
            Button {
                self.view2 = true
            } label: {
                Text("Go to next view")
            }
            
        }
        .navigationTitle("Home")
    }
}

struct View2: View {
    @Environment(\.presentationMode) var presentationMode
    
    var body: some View {
        VStack {
            Text("This is View 2")
                .padding()
            Button {
                presentationMode.wrappedValue.dismiss()
            } label: {
                Text("Go to Home view")
            }
            
        }
        .navigationTitle("View 2")
    }
}

【讨论】：