NavigationSplitView: Make button clickable in detail-section safe area

Hi,

I've tried to find a solution for this problem for weeks now but it seems no one knows how to solve it and Apple doesn't seem to care.

I have a NavigationSplitView with two columns. In the detail column I have a button - or any other clickable control - which is placed in the very top where usually the safe area resides.

The button is NOT clickable when he is in the safe area and I have NO idea why. I know I can place buttons in safe areas of other views and they are clickable.

Please have a look at the code:

`struct NavTestView: View {

var body: some View {
    GeometryReader { p in
        VStack(spacing: 0) {
            NavigationSplitView {
                List(names) {
                    Text($0.name).frame(width: p.size.width)
                        .background(Color.green)
                }.listRowSpacing(p.size.height * 0.15 / 100 )
                
                    .toolbar(.hidden, for: .navigationBar)
            } detail: {
                TestView().ignoresSafeArea()
            }.frame(width: p.size.width, height: p.size.height, alignment: .topLeading)
                .background(Color.yellow)
        }
    }
}

}

struct TestView: View {

var body: some View {
    GeometryReader { p in
        let plusButton = IconButton(imageName: "plus.circle.fill", color: Color(uiColor: ThemeColor.SeaFoam.color),
                                    imageWidth: p.size.width * 5 / 100, buttonWidth: p.size.width * 5 / 100)
        let regularAddButton = Button(action: {  log.info("| Regular Add Button pressed") } ) {
            plusButton
        }
            
        VStack {
            regularAddButton
        }.frame(width: p.size.width , height: p.size.height, alignment: .top)
         .background(Color.yellow)
    }
}

}

`

this code produces the following screen:

Any help would be really greatly appreciated!

Thank you!

Frank

I responded to one of your other posts from October 23 with this comment:

I'm facing this same issue in macOS 26 (Tahoe), almost two years after the last activity on this thread.

Out of pure luck, I discovered that if you set the button style to .buttonStyle(.borderless) then the button becomes clickable. I have no idea why that works and the other button styles don't. By the way, I don't have this problem on the iPad, using the same code. The buttons are clickable there.

Does anybody have any other tips on how to have a custom, clickable toolbar in the safe area when using NavigationSplitView? I still want the system toolbar visible in the sidebar, but I want to have my own UI in the top edge of the detail view.

NavigationSplitView: Make button clickable in detail-section safe area
 
 
Q