如何删除表格上方的额外边距 [英] How to remove extra margin above a Form

问题描述

我希望我的视图的一部分包含在 Form 中，但不是整个内容.我不希望 Form 占用那么多空间，所以我使用 .frame() 缩小了它.虽然Form上面还有很多边距.这是我的代码.

I want part of my view to be wrapped inside a Form, but not the whole thing. I don't want the Form to take up that much space, so I've shrunken it using .frame(). Although there is still a lot of margin on top of the Form. Here's my code.

struct ContentView: View {
    var body: some View {
        NavigationView {
            ScrollView {
                VStack {
                    Form {
                        Text("Some text in a form")
                    }
                        .frame(width: 400, height: 90) // shrinks Form size, but doesn't remove margin
         
                    Text("Some more text")
               }
            }
        }
    }
}

.frame() 高度似乎并没有移除表单顶部的额外空间(浅灰色区域).

The .frame() height doesn't seem to remove that extra space at the top of the Form (light grey area).

我还尝试将 .listRowInsets(EdgeInsets()) 添加到第一个 Text 视图，但这并没有删除顶部边距.有什么想法吗?

I've also tried adding .listRowInsets(EdgeInsets()) to the first Text view, but that doesn't remove the top margin. Any ideas?

推荐答案

那个空白区域是大标题的导航视图栏空间(默认情况下)，在您的情况下是空的，所以只需隐藏它

That empty space is navigation view bar space for large title (by default), which is empty in your case, so just hide it

    var body: some View {
        NavigationView {
            ScrollView {
                VStack {
                    Form {
                        Text("Some text in a form")
                    }
                        .frame(width: 400, height: 90) // shrinks Form size, but doesn't remove margin

                    Text("Some more text")
               }
            }
            .navigationBarTitle("")            // << this !!
            .navigationBarHidden(true)      // << and this !!
        }
    }

这篇关于如何删除表格上方的额外边距的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！