Remove extra line separators below List in SwiftUI

Question

I've created a simple List as below, but there are extra separators below it.

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

Result:

I've tried embedding the List inside a VStack and adding Spacer() like below code but it's not working properly. It removes about half of the empty cells.

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

How would I remove these extra separators in SwiftUI?

Answer 1

iOS 14:

iOS 14 doesn't show extra separators below the list by default and to removing all separators, you need to use a LazyVStack inside a ScrollView instead. (because iOS is NOT supporting appearance for SwiftUI lists anymore).

---

iOS 13:

⚠️ This method is deprecated and it's not working from iOS 14

No need for Section or .grouped style!

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

- Extra separators (below the list):

you need a tableFooterView and to remove. Note that iOS 14 doesn't show extra separators below the list by default.

- All separators (including the actual ones):

you need separatorStyle to be .none

init() {     if #available(iOS 14.0, *) {          // iOS 14 doesn't have extra separators below the list by default.     } else {         // 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")     } } 

Note that it eliminates all tables/lists's separators. So you can toggle it in a methods like onAppear() or etc. as you wish.

Answer 2

It's not a perfect solution, but you could use a ScrollView, where each cell is created using a ForEach call, and the dividers are created using Divider().

Edit: I spoke with Apple engineers at WWDC about this. They have heard lots of feedback regarding removing/changing dividers. However, for now my above answer is their recommendation.