Remove button readout from NavigationLink with VoiceOver on

Question

I follow this guide to create navigation programmatically in SwiftUI.

Now the issue is that when VoiceOver is turned on, VoiceOver will read out the NavigationLink as button although it's completely visually invisible to users.

How do we stop VoiceOver from reading out this NavigationLink?

struct ContentView: View {
    @State private var isShowingDetailView = false

    var body: some View {
        NavigationView {
            VStack {
                NavigationLink(destination: Text("Second View"), isActive: $isShowingDetailView) { EmptyView() }

                Button("Tap to show detail") {
                    isShowingDetailView = true
                }
            }
            .navigationTitle("Navigation")
        }
    }
}

Answer 1

I'll assume that you are targeting iOS 15 or below, because in iOS 16, you should use navigationDestination(isPresented:destination:), which won't have this problem. Even if you are targeting iOS 15, I'd still suggest that you use @available to check for iOS 16.

You can use accessibilityHidden to completely hide an element from the accessibility system.

NavigationLink(
    destination: Text("Second View"), 
    isActive: $isShowingDetailView
) { EmptyView() }
    .accessibilityHidden(true)