4

I have a simple Example of NavigationSplitView with different types in the Sidebar, including an OutlineGroup.

Problem: OutlineGroup's parent nodes are selectable, child nodes (leafs) are not. Nodes without children also are not selectable.

Target is macOS. Any Ideas?

enter image description here

struct Tree: Identifiable, Hashable {
    let id = UUID()
    var name: String
    var children: [Tree]? = nil
}

enum SideBar: Hashable {
    case number(Int)
    case tree(Tree)
}

struct ContentView: View {
    
    let trees = [
        Tree(name: "One", children: [Tree(name: "One-1"), Tree(name: "One-2"), Tree(name: "One-3")]),
        Tree(name: "Two", children: [Tree(name: "Two-1"), Tree(name: "Two-2"), Tree(name: "Two-3")]),
        Tree(name: "Three"),
    ]
    
    @State private var selection: SideBar?
    
    var body: some View {
        
        NavigationSplitView {
            List(selection: $selection) {
                
                Section("Numbers") {
                    ForEach(1..<6) { number in
                        NavigationLink("\(number)", value: SideBar.number(number))
                    }
                }
                
                Section("Tree") {
                    OutlineGroup(trees, children: \.children) { tree in
                        NavigationLink(tree.name, value: SideBar.tree(tree))
                    }
                }
            }
            
        } detail: {
            switch selection  {
            case .number(let nr):
                Text("Number \(nr)")
                    .navigationTitle("Numbers")
            case .tree(let tree):
                Text("Tree element \(tree.name)")
                    .navigationTitle("Tree")

            case nil:
                Text("please choose")
            }
        }
    }
}

EDIT:

Based on @Asperi's comment: This works – but seems not very native.

            Section("Tree") {
                OutlineGroup(trees, children: \.children) { tree in
                    NavigationLink(tree.name, value: SideBar.tree(tree))
                        .onTapGesture {
                            selection = SideBar.tree(tree)
                        }
                }
            }

Does anybody have a more straightforward solution?

ChrisR
  • 9,523
  • 1
  • 8
  • 26
  • 2
    Try without links, using only list selection, by documentation NavigationSplitView tracks selections and links columns content by itself, so we can just use selection in details. I cannot test, no macOS 13 installed. – Asperi Jul 24 '22 at 16:51
  • @Asperi: you mean setting list selection manually onTapGesture? That works for the detail view, but does not highlight the selected item in the sidebar. – ChrisR Jul 24 '22 at 17:28
  • I'm having this same issue (although the solution does not work). Appears to only be related to OutlineGroup in this NavigationLink (with value). I'm using Xcode 14.2. Is this a SwiftUI bug? I am submitting an Apple developer support request shortly. – Eric Anderson Jan 07 '23 at 00:32

0 Answers0