9

I'm trying to hide the divider between cells in a List, but looks like there is no way to do it, based on Apple´s documentation.

Any idea for how to do it?

Glenn Howes
  • 5,447
  • 2
  • 25
  • 29
Daplerio
  • 155
  • 2
  • 9

1 Answers1

16

iOS 15:

This year Apple introduced a new modifier .listRowSeparator that can be used to style the separators. you can pass .hidden to hide it:

List {
    ForEach(items, id:\.self) { 
        Text("Row \($0)")
            .listRowSeparator(.hidden)
    }
}

iOS 14

In iOS 14, you may consider using LazyVStack instead of list for this:

ScrollView {
    LazyVStack {
        ForEach((1...100), id: \.self) {
           Text("Placeholder \($0)")
        }
    }
}

Keep in mind that LazyVStack is lazy and doesn't render all rows all the time. So they are very performant and suggested by Apple itself in WWDC 2020.


iOS 13

There is a UITableView behind SwiftUI's List for iOS. So to remove

Extra separators (below the list):

you need a tableFooterView and to remove

All separators (including the actual ones):

you need separatorStyle to be .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")
    }
}
Mojtaba Hosseini
  • 95,414
  • 31
  • 268
  • 278
  • Friendly reminder: apply `.listRowSeparator(.hidden)` to each _element_ in the `List` – not to the `List` itself, because that won't do anything. – PDK Jun 30 '23 at 10:45