在SwiftUI中的列表下方删除多余的分隔符

Question

我创建了一个简单的List如下，但下面有额外的分隔符。

List {
  Text("Item 1")
  Text("Item 2")
  Text("Item 3")
}

结果：

我试过将List嵌入到a中，VStack并添加Spacer()如下代码，但是它无法正常工作。它删除了大约一半的空单元格。

VStack{
  List {
    Text("Item 1")
    Text("Item 2")
    Text("Item 3")
  }
  Spacer()
}

如何在SwiftUI中删除这些多余的分隔符？

Answer 1

这不是一个完美的解决方案，但是您可以使用ScrollView，其中使用ForEach调用创建每个单元，并使用Divider（）创建分隔线。

编辑：我与WWDC的Apple工程师进行了交谈。他们听到了很多有关拆除/更换分频器的反馈。但是，目前我上面的答案是他们的建议。

Answer 2

这仅适用于 iOS 13 版本。

使用onAppear修改分隔符样式UITableView并恢复到初始状态onDisappear

List {}
.onAppear { UITableView.appearance().separatorStyle = .none }
.onDisappear { UITableView.appearance().separatorStyle = .singleLine }

Answer 3

这不是理想的解决方案，但是您可以创建列表样式.grouped，.listStyle(.grouped)以删除下面可能出现的任何空白单元格。

Answer 4

不需要Section或.grouped样式！

iOS的UITableViewSwiftUI背后有一个List。所以要删除

-额外的分隔符（在列表下方）：

您需要一个tableFooterView和来删除

-所有分隔符（包括实际的分隔符）：

你需要separatorStyle是.none

init() {
    // To remove only extra separators below the list:
    UITableView.appearance().tableFooterView = UIView()

    // To remove all separators including the actual ones:
    UITableView.appearance().separatorStyle = .none
}

var body: some View {
    List {
        Text("Item 1")
        Text("Item 2")
        Text("Item 3")
    }
}

请注意，它消除了所有表/列表的分隔符。因此，您可以根据需要使用诸如onAppear()或之类的方法来切换它。

Answer 5

添加一个白色矩形作为页脚并使用0 EdgeInsets为我工作：

struct Footer: View {
    var body: some View {
        Rectangle()
            .foregroundColor(.white)
            .listRowInsets(EdgeInsets())
    }
}

struct Timeline : View {
    var body: some View {
        List {
            Section(footer: Footer()) {
                Text("Item 1")
                Text("Item 2")
                Text("Item 3")
            }
        }
    }
}

唯一的问题是它还添加了一个Header，但我不确定如何摆脱它。