How do I create a UISplitViewController in SwiftUI without grouped table style?

245 views Asked by At

TL;DR

SwiftUI's UISplitViewSplitView controller setup is grouping my table view. Why?

struct ContentView: View {
    var body: some View {
        NavigationView {
            List(0..<5) { value in
                HStack {
                    Text("Value \(value)")
                }
            }
            .navigationTitle("List View")

            Text("Split View")
        }
    }
}

Sample 1

A grouped iOS table view

Longer

I'm working through the SwiftUI track of WWDC20, treating it as a code-a-long. Beginning with the first video, "Introduction to SwiftUI".

I started a whole sample project with resources and everything. Everything goes swimmingly until I start working to support the iPad. I'm aware that there did end up being some changes since the videos were produced, but haven't found any relevant to the UISplitController.

After the bug presented itself I stood up a smaller project that just presented the split controller to test this issue.

So long as I'm just presenting the ContentView for iPhone, the UI works as expected.

struct ContentView: View {
    var body: some View {
        NavigationView {
            List(0..<5) { value in
                HStack {
                    Text("Value \(value)")
                }
            }
            .navigationTitle("List View")
        }
    }
}

Sample 2

An ungrouped iOS table view

I've tried executing on device and the problem persists.

1

There are 1 answers

2
Asperi On BEST ANSWER

Just use plain list style explicitly:

var body: some View {
    NavigationView {
        List(0..<5) { value in
            HStack {
                Text("Value \(value)")
            }
        }
        .listStyle(PlainListStyle())       // << here !!
        .navigationTitle("List View")

        Text("Split View")
    }
}