SwiftUI iOS14 - NavigationView + List - Won't fill space SwiftUI iOS14 - NavigationView + List - Won't fill space swift swift

SwiftUI iOS14 - NavigationView + List - Won't fill space


Problem

It looks like the default styles of a List or NavigationView in iOS 14 may in some cases be different than in iOS 13.

Solution #1 - explicit listStyle

It's no longer always the PlainListStyle (as in iOS 13) but sometimes the InsetGroupedListStyle as well.

You need to explicitly specify the listStyle to PlainListStyle:

.listStyle(PlainListStyle())

Example:

struct ContentView: View {    var views = ["Line 1", "Line 2", "Line 3"]    var body: some View {        NavigationView {            VStack {                List {                    ForEach(views, id: \.self) { view in                        VStack {                            Text("\(view)")                        }                        .background(Color.red)                    }                }                .listStyle(PlainListStyle()) // <- add here            }        }    }}

Solution #2 - explicit navigationViewStyle

It looks like the NavigationView's default style can sometimes be the DoubleColumnNavigationViewStyle (even on iPhones).

You can try setting the navigationViewStyle to the StackNavigationViewStyle (as in iOS 13):

.navigationViewStyle(StackNavigationViewStyle())

Example:

struct ContentView: View {    var views = ["Line 1", "Line 2", "Line 3"]    var body: some View {        NavigationView {            VStack {                List {                    ForEach(views, id: \.self) { view in                        VStack {                            Text("\(view)")                        }                        .background(Color.red)                    }                }            }        }        .navigationViewStyle(StackNavigationViewStyle()) // <- add here    }}