SwiftUI 布局 - VStack 中的 NavigationView - 填充高度

Question

鉴于以下观点：

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            SomeView()
            Spacer()

            HStack {
                Text("Some Text1")
                Spacer()
                Text("Some Text2")
                Spacer()
                Text("Some Text2")
            } .background(Color.green)

        } .background(Color.blue)

    }
}

struct SomeView: View {
    var body: some View {
        VStack {
            Text("Hello, World!")
        } 
    }
}

一切都按预期进行。绿色的 HStack 位于屏幕底部，其余的屏幕区域被剩余的 VStack 内容填充为蓝色。

一旦 SomeView 被 NavigationView 包裹，这种行为就会改变。绿色的 HStack 仍在屏幕底部，但 NavigationView 并没有填满整个其余部分。有一个小蓝都留下了。如何删除它以让 NavigationView 填充内容区域？

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            SomeView()
            Spacer()

            HStack {
                Text("Some Text1")
                Spacer()
                Text("Some Text2")
                Spacer()
                Text("Some Text2")
            } .background(Color.green)

        } .background(Color.blue)

    }
}

struct SomeView: View {
    var body: some View {
        NavigationView {
            VStack {
                Text("Hello, World!")
            } .navigationBarTitle(Text("Test"))
        }
    }
}

提前感谢您的帮助！

Answer 1

删除Spacer 并将VStack 间距设置为零。这是我的代码。希望对你有帮助。

    struct ContentView: View {
        var body: some View {
            VStack(spacing: 0) {
                SomeView()
                HStack {
                    Text("Some Text1")
                    Spacer()
                    Text("Some Text2")
                    Spacer()
                    Text("Some Text2")
                } .background(Color.red)

            } .background(Color.blue)

        }
    }

    struct SomeView: View {
        var body: some View {
            NavigationView {
                VStack {
                    Text("Hello, World!")
                } .navigationBarTitle(Text("Test"))
            }
        }
    }