SwiftUI导航查看屏幕底部的额外空间

Question

我是Swift的新手，正在尝试使用SwiftUI中的NavigationView创建一个简单的屏幕。由于某种原因，当我在NavigationView中包装任何内容时，它会在底部添加额外的空间。我想看看是否还有其他人遇到此问题。

这是我的HomeView:

struct HomeView: View {
    var body: some View {
        NavigationView {
                ZStack {
                    Color.surface.edgesIgnoringSafeArea(.all)
                    Text("HOME")
                }
        }
    }
}

这是我的带有TabView的ContentView:

struct ContentView: View {
    @EnvironmentObject var session: SessionStore
    @State private var selected = 1
    @State private var loaded: Bool = false

    var ref: DatabaseReference! = Database.database().reference()

    func getUser() {
        //Promisify this
        session.listen()
        self.loaded = true
        // Firebase test
        self.ref.child("users").child("test").setValue(["username" : "TEST"])
    }


    // Sets the bottom tab background color
    init(){
        UITabBar.appearance().isTranslucent = false
        UITabBar.appearance().barTintColor = UIColor(named: "card2")
    }

    var body: some View {
        Group {
            if (self.loaded == false){
                Text("loading...")
            }

            else if (session.session != nil) {
                TabView(selection: $selected) {
                    HomeView()
                        .tabItem {
                            Image(systemName: "music.house.fill")
                            Text("Home")
                        }

                    MyRoutinesView()
                        .tabItem({
                            Image(systemName: "music.note.list")
                            Text("My Routines")
                        }).tag(1)

                    MetronomeView()
                        .tabItem({
                            Image(systemName: "music.note")
                            Text("Tools")
                        }).tag(2)

                    SettingsView()
                        .tabItem({
                            Image(systemName: "gear")
                            Text("Settings")
                        }).tag(3)

                }
                //.background(Color.surface)
                .accentColor(Color.white)
                //.font(.headline)
            } else if (self.loaded == true && session.session == nil) {
                AuthView()
            }
        }.onAppear(perform: getUser)
    }
}

// Gets colors from assets
extension Color {
    static let primary = Color("primary")
    static let secondary = Color("secondary")
    static let surface = Color("surface")
    static let card = Color("card")
    static let cardShadow = Color("cardShadow")
    static let card2 = Color("card2")
}

这是当前的样子(问题是标签导航上方的空间):

Home View

预先感谢大家提供的任何帮助!

Answer 1

弄清楚了!

在我的init()中，这行代码正在创建似乎是另一个标签栏的代码。不知道为什么它不喜欢这样的代码，但是在下一行就可以了:

UITabBar.appearance().isTranslucent = false

谢谢你们!我昨晚和今天早上都花了整整哈哈，仅几周就学会了React Native带来的敏捷性。