SwiftUI: NavigationView Customizability

In SwiftUI, the main method of navigating from one view to another will be with NavigationViews and NavigationLinks. The default layout for content using NavigationViews varies by orientation and device. For example, iPad Portrait has a "drawer" on the left that can be pulled out by swiping. However, in iPad Landscape, as well as iPhone 8 Plus Landscape among other device versions, the drawer stays open. The following code snippet can be used to replicate what I mean:


struct ContentView: View {
 
    var body: some View {
        NavigationView {
            NavigationLink(destination: Text("DetailView")) {
                Text("DrawerView")
            }
        }
    }
}


That being said, what options do we have for forcing the behavior for certain orientations and device models? For example, I would like to be able to either force iPad Portrait to have the same behavior as iPad Landscape, or give it the regular behavior we have on an iPhone 11, where the back button and NavigationBar appear on the top.

Up vote post of TroyRO Down vote post of TroyRO
2k views
Posted by
TroyRO
Reply
Add a Comment

Replies

I don't see a way at the moment to make the two-column appearance function on iPad in portrait mode at the moment. I'd suggest filing a bug about that, and hopefully Apple will either open up NavigationViewStyle's API a bit, or will provide an initializer for DoubleColumnNavigationViewStyle() that will allow you to pin the master view on iPad.


The second option, though, is definitely possible. To make iPad always behave in the same manner as an iPhone and show either the master or a detail view, you can apply the StackNavigationViewStyle to your navigation view:


NavigationView {
    MasterView()
    DetailView()
}
.navigationViewStyle(StackNavigationViewStyle())
Posted by
Jim Dovey
Up vote reply of Jim Dovey Down vote reply of Jim Dovey
Add a Comment