屏幕顶部的 Swiftui 隐形栏

Question

我有以下问题。 如果我尝试为视图提供颜色（例如 Color.red） 我得到以下输出：

我可以添加 .edgesignoressafearea(.top) 并且顶部也会变红。但是当我想添加一个可点击的项目时，用户将无法点击它，因为屏幕顶部仍然有这个不可见的栏。有谁知道我的问题是什么？问题出在所有选项卡视图（时间轴、收藏夹、发现、帐户）中。所以它必须在我在这篇文章中发送的第一个代码或 tabview（第二个代码）中。

当用户首先点击应用时，他们会看到此视图将用户发送到登录视图或应用本身：

var body: some View {
    NavigationView {
        VStack {
            NavigationLink(destination: tabView().navigationBarHidden(true), isActive: $tabview, label: { EmptyView() })
            NavigationLink(destination: loginView().navigationBarHidden(true), isActive: $login, label: { EmptyView() })
                
            if tabview == false && login == false {
                Text("loading")
                    .onAppear(perform: checklogin)
            }
        }
        .navigationBarBackButtonHidden(true)
        .navigationBarHidden(true)
    }
}

然后应用程序将它们发送到 tabview：

 var body: some View {
    TabView(selection: $selection) {
        Timeline()
            .tabItem {
                Label("timeline", systemImage: "house")
            }
            .tag(0)
        
        Favorits()
            .tabItem {
                Label("favorits", systemImage: "heart")
            }
            .tag(1)
        
        Discover()
            .tabItem {
                Label("discover", systemImage: "network")
            }
            .tag(2)
        
        Account()
            .tabItem {
                Label("account", systemImage: "person")
            }
            .tag(3)
    }
    .navigationBarBackButtonHidden(true)
    .navigationBarHidden(true)
 }

问题发生在所有这些视图上。 这是我截屏的视图：

var body: some View {
    ZStack {
        Color.red
        Text("Hello fav!")
    }
    .navigationBarBackButtonHidden(true)
    .navigationBarHidden(true)
}

Answer 1

如果您不想随时返回登录视图，请添加 .edgesIgnoringSafeArea(.top) 并删除导航栏。 这是带有登录页面的完整代码，现在取决于您在该登录页面上想要什么：

import SwiftUI

struct ContentView: View {
@State var showLoginView: Bool = false

    var body: some View {
        VStack {
            if showLoginView {
                MainView()
            } else {
                Button("Login") {
                    self.showLoginView = true
                }
            }
        }
    }
}

struct MainView: View {
    var body: some View {
        TabView {
            TimeLine()
                .tabItem {
                    Label("timeline", systemImage: "house")
                }
            Favorits()
                .tabItem {
                    Label("favorits", systemImage: "heart")
                }
            Discover()
                 .tabItem {
                     Label("discover", systemImage: "network")
              }
            Account()
                 .tabItem {
                     Label("account", systemImage: "person")
              }
        }
        
    }
    
}
    
struct TimeLine: View {
    var body: some View {
        Color.blue
            .edgesIgnoringSafeArea(.top)
    }
}

struct Favorits: View {
    var body: some View {
        ZStack {
            Color.red
                .edgesIgnoringSafeArea(.top)
            Text("Hello fav!")
        }
    }
}

struct Discover: View {
    var body: some View {
        Color.yellow
            .edgesIgnoringSafeArea(.top)
    }
}
struct Account: View {
    var body: some View {
        Color.purple
            .edgesIgnoringSafeArea(.top)
    }
}


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

Answer 2

您需要将导航标题设置为“”，因为您的视图嵌入在 NavigationView 中

像这样创建一个 ViewModifier 并将其应用到您的 VStack

struct HiddenNavBarModifier: ViewModifier {
    func body(content: Content) -> some View {
        content
        .navigationBarTitle("", displayMode: .inline)
        .navigationBarHidden(true)
    }
}