CODEWITHSUNDEEP
iosswiftswiftui
Async-
Async-

Reputation: 3289

Swift UI need to keep both NavigationLink to detail view and Tap gesture recognizer

I am trying a simple app that is a List with items, they lead to detail view. I also have a search bar that opens keyboard, and I need to hide the keyboard when the user taps anywhere outside of the keyboard. 

@State private var keyboardOpen: Bool = false

var body: some View {

    NavigationView {
        Form {
            Section {

                TextField("Search", text: $cityStore.searchTerm, onCommit: debouncedFetch)
                    .keyboardType(.namePhonePad)
                    .disableAutocorrection(true)        
                    .onTapGesture { self.keyboardOpen = true }
                    .onDisappear { self.keyboardOpen = false }
            }

            Section {
                List {
                    ForEach(cities) { city in
                        NavigationLink(
                        destination: DetailView(city: city)) {
                            VStack(alignment: .leading) {
                                Text("\(city.name)")
                            }
                        }
                    }
                }
            }
        }
        .navigationBarTitle("City list")
        .onTapGesture {
            if self.keyboardOpen {
                UIApplication.shared.endEditing()
                self.keyboardOpen = false
            }
        }
    }
}

Do you know if it's possible to keep both gesture tap and follow to detail view?

Upvotes: 1

Views: 964

Answers (2)

Asperi
Asperi

Reputation: 258365

Actually it should work, but it is not due to bug of .all GestureMask. I submitted feedback to Apple #FB7672055, and recommend to do the same for everybody affected, the more the better.

Meanwhile, here is possible alternate approach/workaround to achieve similar effect.

Tested with Xcode 11.4 / iOS 13.4

extension UIApplication {  // just helper extension
    static func endEditing() {
        UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to:nil, from:nil, for:nil)
    }
}

struct TestEndEditingOnNavigate: View {
    @State private var cities = ["London", "Berlin", "New York"]
    @State private var searchTerm = ""
    @State private var tappedLink: String? = nil // track tapped link

    var body: some View {
        NavigationView {
            Form {
                Section {
                    TextField("Search", text: $searchTerm)
                }

                Section {
                    List {
                        ForEach(cities, id: \.self) { city in
                            self.link(for: city) // decompose for simplicity
                        }
                    }
                }
            }
            .navigationBarTitle("City list")
        }
    }

    private func link(for city: String) -> some View {
        let selection = Binding(get: { self.tappedLink }, // proxy bindng to inject...
            set: {
                UIApplication.endEditing()           // ... side effect on willSet
                self.tappedLink = $0
        })
        return NavigationLink(destination: Text("city: \(city)"), tag: city, selection: selection) {
            Text("\(city)")
        }
    }
}

Upvotes: 2

Camilo Patino
Camilo Patino

Reputation: 46

I think you could easily handle this scenario with boolean flags, when your keyboard opens you can set a flag as true and when it dismisses a the flag goes back to false, so in that case when the keyboard is open and the tap gesture is triggered you can check if the keyboard flag is active and not go to detail but instead effectively dismiss the keyboard and viceversa. Let me know if maybe I misunderstood you.

Upvotes: 0

Related Questions