Search code examples
swiftuiswiftui-navigationviewswiftui-navigationsplitviewvisionos

How to perform nested navigation in visionOS

I'm displaying a simple NavigationStack with some options, which navigate to a component with a NavigationView that looks something like this:

NavigationView {
    List(courseMetadata.lessons, selection: $selection) { lesson in
        NavigationLink {
            LessonDetail(lesson: lesson)
        } label: {
            LessonRow(lesson: lesson)
        }
    }
    .navigationTitle("Main title")
}
.navigationTitle(course.fullTitle)

my problem is that the inner NavigationLinks seems to be pushing LessonDetail on the top NavigationStack instead of the NavigationView, losing the left menu as in the expected result below.-

enter image description here

I actually managed to get this result by replacing NavigationView for a NavigationSplitView, like this.-

NavigationSplitView {
    List(courseMetadata.lessons, selection: $selection) { lesson in
        NavigationLink(value: lesson) {
            LessonRow(lesson: lesson)
        }
    }
    .navigationTitle("\(courseMetadata.lessons.count) Lessons")
} detail : {
    if let lesson = selection {
        LessonDetail(lesson: lesson)
    }
}
.navigationTitle("Main title")

which might be good enough, but unfortunately I'm losing the nice styles the system sets for NavigationView.-

enter image description here

So, my question is, is there any way to specify in which NavigationView I want to stack my detail view?

EDIT Alternatively, if there's any "straightforward" way to setup NavigationSplitView so that it looks like NavigationView (nice container background, horizontal dividers and chevron icons), that'd do the trick too :)

Solution 
  • NavigationView

    Was deprecated a few OS versions ago, I wouldn’t expect vision OS to work with it.

    Alternatively you can use

    NavigationSplitView

    With

    .listStyle(.grouped)