SwiftUI - 放置在 NavigationView 中时 VStack 不会填满整个屏幕

Question

似乎当放置在 NavigationView 中时，VStacks 不会填充整个垂直空间。或者也许我做错了什么？

var body: some View {
    NavigationView {
        VStack(alignment: .leading) {
            Text("HEY")
        }
        .frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height)
        .background(.gray)
    }
    .navigationBarTitle("Reçu", displayMode: .inline)
}

我还定制UINavigationBar了一些颜色并设置navigationBarTitle为内联。

我尝试了两种解决方法：

• .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: Alignment.topLeading)
• .frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height)

第一个填充更多的垂直空间，但不是全部。

Answer 1

看起来有两个导航视图添加到您的视图层次结构中。

• 如果父视图有 aNavigationView并且您要使用它进入子视图NavigationLink，那么您不必将 a 添加NavigationView到它自动添加的子视图中。
• 如果您直接rootView为您的设置 new UIHostingController，则添加NavigationView到该 new 中rootView。

Answer 2

为了让您的视图有背景颜色，我建议您选择视图ZStack：

\n\n

struct ContentView: View {\n    var body: some View {\n        NavigationView {\n            ZStack {\n                Color.gray                \n            }\n            .edgesIgnoringSafeArea(.all)\n            .navigationBarTitle("Re\xc3\xa7u", displayMode: .inline)\n        }\n    }\n}\n

\n\n

您甚至可以创建将颜色作为参数的自定义视图（以便在您想要的任何地方重复使用）：

\n\n

struct BgColorView<Content>: View where Content: View{\n    private let color: Color\n    private let content: () -> Content\n\n    init(color: Color, @ViewBuilder content: @escaping () -> Content) {\n        self.color = color\n        self.content = content\n    }\n    var body: some View {\n        ZStack {\n            color.edgesIgnoringSafeArea(.all)\n            content()\n        }\n    }\n}\n\nstruct ContentView: View {\n    var body: some View {\n        NavigationView {\n            BgColorView(color: Color.green) {\n                Text("Hello world!")\n            }\n            .navigationBarTitle("Re\xc3\xa7u", displayMode: .inline)\n        }\n    }\n} \n

\n\n

对于第二个问题，这完全取决于您的需求。让内容在左上角对齐的最简单方法是使用视图Spacer。

\n\n

struct ContentView: View {\n    var body: some View {\n        NavigationView {\n            BgColorView(color: Color.green) {\n                VStack {\n                    HStack {\n                        Text("Hello world!")\n                        Spacer()\n                    }\n                    Spacer()\n                }\n            }\n            .navigationBarTitle("Re\xc3\xa7u", displayMode: .inline)\n        }\n    }\n}\n

\n\n

但同样，这取决于你想要得到什么。

\n