NavigationView SwiftUI shows split view in iPad
Asked Answered
P

3

14

With NavigationView being the root of UIHostingController , the below code shows split view for iPad.

struct ContentView: View {
    var body: some View {
        
        NavigationView {
            Text("Hello")
                .navigationBarTitle("Home")
        }
    }
}

With the above code it shows split view on iPad. How can I still use the NavigationView and get rid of split view for iPad , as I am looking to have a List and on tap of which it should push another view?

enter image description here enter image description here

Peg answered 28/6, 2020 at 15:21 Comment(0)
A
26

Use stack navigation view style explicitly (by default it is platform-dependent)

NavigationView {
   Text("Hello")
       .navigationBarTitle("Home")
}
.navigationViewStyle(StackNavigationViewStyle())
Acidulent answered 28/6, 2020 at 15:28 Comment(2)
Works great! Just a note for others: the .navigationViewStyle modifier must be attached directly to the NavigationView, as shown here. I originally had it attached to my inner view and it did not work. – Sampler
Took me a while to find this. Beautiful. – Vexatious
S
1

That did not work for me nor did using any other NavigationStyle on iPad using IOS 14.2. The root view always looks like this.

    var body: some View {
    NavigationView {
        VStack {
            List {
                ForEach(self.ideas) { Idea in
                    IdeaListRow(idea: Idea)
                }
                .onDelete { (indexSet) in
                    let ideaToDelete = self.ideas[indexSet.first!]
                    self.managedObjectContext.delete(ideaToDelete)
                    
                    do {
                        try self.managedObjectContext.save()
                    } catch {
                        print(error)
                    }
                }
            }
            .navigationViewStyle(DoubleColumnNavigationViewStyle())
            .navigationBarTitle(Text("Idea List"))
            .listStyle(GroupedListStyle())
            .navigationBarItems(leading:
                                    NavigationLink(destination: AddView()) {
                                        Text("Add")
                                    } , trailing: EditButton())
        }
    }
}

enter image description here

Silicosis answered 24/11, 2020 at 15:14 Comment(0)
M
0

βœ… iOS 16

Since the NavigationView has been DEPRECATED and as Apple suggests:

Use NavigationStack instead. For more information, see Migrating to new navigation types.

struct ContentView: View {
    var body: some View {
        
        NavigationStack { // πŸ‘ˆ here
            Text("Hello")
                .navigationBarTitle("Home")
        }
    }
}

πŸ”„ iOS 13

Use .navigationViewStyle(.stack) modifier on the NavigationView

struct ContentView: View {
    var body: some View {
        
        NavigationView {
            Text("Hello")
                .navigationBarTitle("Home")
        }
        .navigationViewStyle(.stack) // πŸ‘ˆ here
    }
}
Malang answered 28/10, 2023 at 10:16 Comment(0)

© 2022 - 2024 β€” McMap. All rights reserved.