1

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.

HangarRash
  • 7,314
  • 5
  • 5
  • 32
alionthego
  • 8,508
  • 9
  • 52
  • 125
  • 1
    I have come across BalancedNavigationSplitViewStyle() which shows both sidebar and detail together but unfortunately it still allows the sidebar to collapse. – alionthego Jan 30 '23 at 11:13
  • Settings doesn't support multitasking split view because there isn't enough room for both columns) so I guess they didn't want to make that possible in SwiftUI. I think it was possible with the old `NavigationView` by overriding the size class with `.environment(\.horizontalSizeClass, .regular)` but I just checked and that has no effect on the new NavigationSplitView. – malhal Jan 30 '23 at 14:39

1 Answers1

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)
        
    }
}
marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
Akshay Gandal
  • 29
  • 7