I'm trying to create a UI with two button bars (top and bottom) inside the detail view of a NavigationSplitView, instead of using the built-in .toolbar() modifier. I'm using .ignoresSafeArea(.container, edges: .vertical) so the detail view can reach into that area.
However, in macOS and iOS 26 the top button is not clickable/tappable because it is behind an invisible View created by the non-existent toolbar. Interestingly enough, if I apply .buttonStyle(.borderless) to the top button it becomes clickable (in macOS).
On the iPad the behavior is different depending on the iPad OS version. In iOS 26, the button is tappable only by the bottom half. In iOS 18 the button is always tappable.
Here's the code for the screenshot:
import SwiftUI
struct ContentView2: View {
@State private var sidebarSelection: String?
@State private var contentSelection: String?
@State private var showContentColumn = true
@State private var showBars = true
var body: some View {
NavigationSplitView {
// Sidebar
List(selection: $sidebarSelection) {
Text("Show Content Column").tag("three")
Text("Hide Content Column").tag("two")
}
.navigationTitle("Sidebar")
} detail: {
VStack(spacing: 0) {
if showBars {
HStack {
Button("Click Me") {
withAnimation {
showBars.toggle()
}
}
.buttonStyle(.borderedProminent)
}
.frame(maxWidth: .infinity, minHeight: 50, idealHeight: 50, maxHeight: 50)
.background(.gray)
.transition(.move(edge: .top))
}
ZStack {
Text("Detail View")
}
.frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .init(horizontal: .center, vertical: .center))
.border(.red)
.onTapGesture(count: 2) {
withAnimation {
showBars.toggle()
}
}
if showBars {
HStack {
Button("Click Me") {
withAnimation {
showBars.toggle()
}
}
}
.frame(maxWidth: .infinity, minHeight: 50, idealHeight: 50, maxHeight: 50)
.background(.gray)
.transition(.move(edge: .bottom))
}
}
.ignoresSafeArea(.container, edges: .vertical)
.toolbarVisibility(.hidden)
}
.toolbarVisibility(.visible)
}
}
I'm confused by this very inconsistent behavior and I haven't been able to find a way to get this UI to work across both platforms.
Does anybody know how to remove the transparent toolbar that is preventing clicks/taps in this top section of the view? I'm hoping there's an idiomatic, native SwiftUI way to do it.