How can I permanently show sidebar in a SwiftUI NavigationView or SplitNavigationView exactly like the Apple Settings App on iPad?

Question

I am trying to display a two column NavigationView in my app exactly like the settings on the iPad. With no way to collapse the sidebar on an iPad. I would have thought using a NavigationView with DoubleColumnStyle would work but it doesn't and it's deprecated. I can use a NavigationSplitView like before to control the initial look however the user is still able to collapse the navigation sidebar.

I thought there would be a simple solution to this but have been looking for a while and haven't found any approach that works.

So far I have the following:

struct SettingsView: View {
    
    @State private var columnVisibility = NavigationSplitViewVisibility.doubleColumn
    
    var body: some View {
        
        NavigationSplitView(columnVisibility: $columnVisibility) {
            Text("Sidebar")
        } detail: {
            Text("Detail")
        }
        
    }
}

Here both the icon in the top left to hide the sidebar is generated automatically and also dragging the sidebar to the left closes it.

Answer 1

If you wan to prevent sidebar from collapsing, you can try .navigationSplitViewStyle(.balanced) modifier. Here is a full demo:

struct ContentView: View {
    
    @State private var columnVisibility =
    NavigationSplitViewVisibility.doubleColumn
    
    var body: some View {
        NavigationSplitView(columnVisibility: $columnVisibility){
            List(0..<30){ i in
                NavigationLink(destination: Text("Details of \(i)")) {
                    Text("id:\(i)")
                }

            } .navigationBarHidden(true)

        } detail: {
            Text("Choose an item from the content")
            
        }
        .navigationSplitViewStyle(.balanced) // this
    }
}

Answer 2

Add add navigationSplitViewStyle balanced and also change columnVisibility to all

struct SettingsView: View {
    
    @State private var columnVisibility = NavigationSplitViewVisibility.all
    
    var body: some View {
        
        NavigationSplitView(columnVisibility: $columnVisibility) {
            Text("Sidebar")
        } detail: {
            Text("Detail")
        }
        .navigationSplitViewStyle(.balanced)
        
    }
}