iosswiftswiftuixcode11

SwiftUI: unwanted split view on iPad


Problem: a view on Pad shows up with unwanted split view.

My current setup is: Catalina OSX beta 5 + Xcode 11 Beta 5

Here is the code I used, with a Navigation View and a Navigation Title:

import SwiftUI

struct SwiftUIView: View {
    var body: some View {
        NavigationView {
            Text("Search")
                .navigationBarTitle(Text("Search"))
        }
    }
}

#if DEBUG
struct SwiftUIView_Previews: PreviewProvider {
    static var previews: some View {
        SwiftUIView()
    }
}
#endif

When simulated on iPad (both physical device and preview) instead of a full screen view, I get this split screen view:

Unwanted split view with NavigationView

If I have just a view, with no NavigationView, I get a full screen view:

import SwiftUI

struct SwiftUIView: View {
    var body: some View {
        Text("Hello World!")
    }
}

#if DEBUG
struct SwiftUIView_Previews: PreviewProvider {
    static var previews: some View {
        SwiftUIView()
    }
}
#endif

Full screen, but without NavigationView

How can I make a NavigationView full screen (not split screen) on iPad?


Solution

  • Update July 2022

    Using NavigationStack instead of NavigationView should display as the main view as you would expect on iPad:

    NavigationStack {
        Text("Hello world!")
    }
    

    *In newer versions, the navigationViewStyle modifier has been deprecated.

    Original answer:

    You can apply the .navigationViewStyle(.stack) modifier to the NavigationView.

    ... 
        NavigationView {
            Text("Hello world!")
        }
        .navigationViewStyle(.stack)
    ...
    

    Edit: Below, I am answering Alexandre's questions from his comment: