SwiftUI中Inline样式Picker与键盘消失手势冲突无法响应求助

我实现了点击页面任意位置隐藏键盘的功能，但发现使用.inline样式的Picker完全无法响应点击选择；换成.menu样式时，Picker弹出正常，功能不受影响。

代码如下：

import SwiftUI

struct DismissKeyboardOnTap: ViewModifier {
    func body(content: Content) -> some View {
        content
            .onTapGesture {
                UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
            }
    }
}

struct Person {
    enum Gender: String, CaseIterable {
        case male, female
    }

    var name: String
    var age: Int
    var gender: Gender
}

struct ContentView: View {
    @State var person: Person
    
    var body: some View {
        Form(content: {
            HStack {
                Text("Name")
                    .frame(alignment: .leading)
                TextField("", text: $person.name)
                    .multilineTextAlignment(.trailing)
            }
            HStack {
                Text("Age")
                    .frame(alignment: .leading)
                TextField("", value: $person.age, formatter: NumberFormatter())
                    .multilineTextAlignment(.trailing)
                    .keyboardType(.decimalPad)
            }
            Picker("Gender", selection: $person.gender) {
                ForEach(Person.Gender.allCases, id: \.self) { gender in
                    Text(gender.rawValue)
                }
            }
            .pickerStyle(.inline)
//            .pickerStyle(.menu)
        })
        .modifier(DismissKeyboardOnTap())
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView(person: Person(name: "John", age: 20, gender: .male))
    }
}

样式对比：

Inline Style	Menu Style

看起来是全局的点击隐藏键盘修饰器阻塞了Inline Picker的交互，求解决办法。

原因分析 #

给整个Form添加的onTapGesture会优先拦截所有点击事件，包括Inline Picker内部的选择交互——因为Inline Picker是嵌入在Form中的子视图，点击事件被外层的手势先捕获并处理，导致Picker无法响应。而Menu样式的Picker是弹出独立的系统菜单，不属于当前视图层级的手势拦截范围，所以不受影响。

修复方案：修改手势逻辑，仅在点击非交互区域时隐藏键盘 #

方案1：简洁版（利用系统endEditing）

修改DismissKeyboardOnTap修饰器，通过透明覆盖层添加手势，调用系统的endEditing()方法——该方法会自动判断当前是否有活跃的键盘，且不会拦截子视图的交互事件：

struct DismissKeyboardOnTap: ViewModifier {
    func body(content: Content) -> some View {
        content
            .overlay(
                Color.clear
                    .contentShape(Rectangle())
                    .onTapGesture {
                        UIApplication.shared.endEditing()
                    }
            )
    }
}

方案2：精准控制版（自定义UIKit手势）

如果需要更精细的交互过滤，可以通过UIKit手势识别器实现，设置cancelsTouchesInView = false来确保子视图能接收到点击事件：

struct DismissKeyboardOnTap: ViewModifier {
    func body(content: Content) -> some View {
        content
            .background(TapView())
    }
}

struct TapView: UIViewRepresentable {
    func makeUIView(context: Context) -> UIView {
        let view = UIView()
        let tapGesture = UITapGestureRecognizer(target: context.coordinator, action: #selector(Coordinator.handleTap))
        tapGesture.cancelsTouchesInView = false // 关键：不阻断子视图的触摸事件
        view.addGestureRecognizer(tapGesture)
        return view
    }
    
    func updateUIView(_ uiView: UIView, context: Context) {}
    
    class Coordinator: NSObject {
        @objc func handleTap(_ gesture: UITapGestureRecognizer) {
            UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
        }
    }
    
    func makeCoordinator() -> Coordinator {
        Coordinator()
    }
}

效果说明 #

两种方案都能保留点击空白区域隐藏键盘的功能，同时让Inline Picker正常响应选择交互。方案1代码更简洁，适合大多数场景；方案2更灵活，可扩展自定义交互判断逻辑。

内容的提问来源于stack exchange，提问作者Will Zhang