iOS Swift SwiftUI - 单击潜台词后使用 NavigationLink

Question

I got this text:

Text("Indem du fortfährst, stimmst du unseren  ") +
Text("Nutzungsbedingungen")
    .underline()
    .foregroundColor(Color("ClickableLink")) +
Text(" und unserer ") +
Text("Datenschutzerklärung")
    .underline()
    .foregroundColor(Color("ClickableLink")) +
Text(" zu")

I'd like to open a new view using NavigationLink after taping on Nutzungsbedingungen or Datenschutzerklärung , both need to open different views.

I've seen those answers:

SwiftUI tappable subtext

but those are either not what I need or trying them gives me errors and I don't know how to modify them since I'm absolutely new to swift/swiftui

Answer 1

Here are two possible approaches, one using the new NavigationStack with NavigationDestination and the other using popOver .

Both have the downside that you can't concatenate Text views within them. But you can still work with HStack/VStack to define the layout.

enum Legals: Identifiable {
    case nutzungsbedingungen
    case datenschutzerklärung
    
    var id: Legals { self }
}

struct ContentView: View {
        
    @State private var selected: Legals?
    
    var body: some View {
        NavigationStack {
            
            // NavigationLink version
            VStack(alignment: .leading) {
                Text("Indem du fortfährst, stimmst du unseren")
                NavigationLink("Nutzungsbedingungen", value: Legals.nutzungsbedingungen)
                Text("und unserer")
                NavigationLink("Datenschutzerklärung", value: Legals.datenschutzerklärung)
                Text("zu")
            }
            .navigationDestination(for: Legals.self) { selection in
                switch selection {
                case .datenschutzerklärung:
                    Text("Datenschutzerklärung")
                case .nutzungsbedingungen:
                    Text("Nutzungsbedingungen")
                }
            }
            
            Divider()
            
            // popOver Version
            VStack(alignment: .leading) {
                Text("Indem du fortfährst, stimmst du unseren ")
                Text("Nutzungsbedingungen")
                    .underline()
                    .onTapGesture {
                        selected = .nutzungsbedingungen
                    }
                Text("und unserer ")
                Text("Datenschutzerklärung")
                    .underline()
                    .onTapGesture {
                        selected = .nutzungsbedingungen
                    }
                Text("zu")
            }
            .popover(item: $selected) { selected in
                switch selected {
                case .datenschutzerklärung:
                    Text("Datenschutzerklärung")
                case .nutzungsbedingungen:
                    Text("Nutzungsbedingungen")
                }
            }
        }
    }
}