删除列表 Swift UI Xcode 11 中的空行

Question

如何使用 Swift UI 删除List中的空行这是我的代码。

struct LandMarkList: View {
    var body: some View {
        NavigationView {
            List(LandMarkListData) { landmark in
                LandMarkRow(landmark: landmark)
            }

        .navigationBarTitle("List")
        }
    }
}

Answer 1

struct LandMarkList: View {
    var body: some View {
        NavigationView {
            List(LandMarkListData) { landmark in
                LandMarkRow(landmark: landmark)
            }

            .navigationBarTitle("List")
            .listStyle(GroupedListStyle())
        }
    }
}

最后我通过添加listStyle找到了解决方案。

Answer 2

NavigationView {
   ...
   .listStyle(.grouped)
}

在你的情况下：

struct LandMarkList: View {
    var body: some View {
        NavigationView {
            List(LandMarkListData) { landmark in
                LandMarkRow(landmark: landmark)
            }

        .navigationBarTitle("List")
        .listStyle(.grouped)
        }
    }
}

Answer 3

据我所知，目前无法从 SwiftUI 的List中删除空单元格。 但是，您仍然可以通过根本不使用List并手动创建Divider来摆脱空单元格（特别是所有那些难看的分隔符）。 尝试以下操作：

ScrollView() {
    ForEach(elements) { element in
        CellView(element: element)
        Divider()
    }
}

Answer 4

这帮助我在 MacOS Catalina 10.15.5 Beta 下使用 Xcode 11.4 摆脱了List中的空行：

List(flights) { flight in
  FlightInfoRow(flightInfo: flight)
}.onAppear{UITableView.appearance().separatorColor = .clear}

如果您想显示现有行的分隔线，您可以在自定义列表行视图中执行此操作。

1. 在 View 中使用GeometryReader的单元格宽度和高度信息。

VStack { 
  GeometryReader { geometry in
    HStack { Text("\(flight.airline)") }
  }
}

2. 使用Path{ path in}在您的内容信息下方绘制一条水平线，如下所示：

Path{ path in
  path.move(to: CGPoint(x: 0, y: geometry.size.height))
  path.addLine(to: CGPoint(x: geometry.size.width, y: geometry.size.height))
}.stroke(Color(.lightGray), lineWidth: 0.5)

这将创建类似这样的内容（没有空行和分隔线的列表）：

Answer 5

多亏了Introspect ，才有可能

我的代码

List() {
  ...
}
.introspectTableView { tableView in
     tableView.separatorColor = UIColor.lightGray.withAlphaComponent(0.4)
     tableView.tableFooterView = UIView()   
}

Answer 6

尝试这样的事情：

let nonEmptyLandmarks = LandMarkListData.filter { !$0.isEmpty }
List(nonEmptyLandmarks) { landmark in
     LandMarkRow(landmark: landmark)
}