在SwiftUI表单中添加无节的视图

时间:2019-11-13 07:21:51

标签: ios swiftui

我没有成功地在Form中添加视图而不将其嵌入Section中,因此我尝试为Section设置Section“不可见”设置Form具有相同的背景,但是我也必须隐藏一些分隔符,我发现这个UITableView.appearance().separatorColor = UIColor(named: "Background")为分隔符设置了与Form背景相同的颜色,但是问题是这适用于整个Form,而我不想要:(

任何想法如何在没有Form的情况下在Section中添加视图,或者如何“隐藏”该部分而又不影响Sections中的其他Form

struct ContentView: View {

    init() {
        UITableView.appearance().separatorColor = UIColor(named: "Background")
    }

    var body: some View {

        Form {
            Section {
                Text("text1")
                Text("text2")
                Text("text3")
            }

            Text("View without section")
                .font(.title)
                .listRowBackground(Color("Background"))
        }
    }
}

enter image description here

2 个答案:

答案 0 :(得分:0)

将此行添加到init()

 UITableView.appearance().separatorStyle = .none

答案 1 :(得分:0)

有点晚了,但可能会帮助其他人:

  1. 将您的内容放在 VStack 中(如果您有多个元素)
  2. .listRowInset 设置为 EdgeInsets()
  3. 设置框架的最大宽度和高度或使用间隔物

使用框架:

VStack(alignment: .leading) {
    Text("Title").font(.headline)
    Text("Subheadline").font(.subheadline)
}
.frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .leading)
.listRowInsets(EdgeInsets())
.background(Color(UIColor.systemGroupedBackground))

使用垫片(此解决方案在顶部和底部添加了更多的填充):

HStack {
    VStack(alignment: .leading) {
        Spacer()
        Text("Title").font(.headline)
        Text("Subheadline").font(.subheadline)
        Spacer()
    }
    Spacer()
}
.listRowInsets(EdgeInsets())
.background(Color(UIColor.systemGroupedBackground))

enter image description here

完整代码:

NavigationView {
    Form {
        VStack(alignment: .leading) {
            Text("Testing a title").font(.headline)
            Text("Testing a subheadline").font(.subheadline)  
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .leading)
        .listRowInsets(EdgeInsets())
        .background(Color(UIColor.systemGroupedBackground))
                
        Section(header: Text("Title and Category").bold()) {
           TextField("Title", text: $title)
           TextField("Category", text: $title)        
        }
    }
    .navigationTitle("Test Form")
}