SwiftUI实现TextField为空时置灰键盘返回/搜索按键

核心思路 #

SwiftUI原生TextField没有直接控制键盘按键状态的接口，所以需要通过包装UIKit的UITextField来实现，利用UIKit的enablesReturnKeyAutomatically属性——这个属性正好能让返回/搜索键在输入框为空时自动置灰，有内容时恢复可用，和原生iOS搜索框行为完全一致。

具体实现代码 #

先创建一个UIViewRepresentable的包装组件：

import SwiftUI

struct CustomSearchTextField: UIViewRepresentable {
    @Binding var text: String
    let placeholder: String
    let returnKeyType: UIReturnKeyType
    
    func makeUIView(context: Context) -> UITextField {
        let textField = UITextField()
        textField.placeholder = placeholder
        textField.returnKeyType = returnKeyType
        // 关键属性：自动根据输入内容是否为空控制返回键状态
        textField.enablesReturnKeyAutomatically = true
        textField.delegate = context.coordinator
        
        // 可选：配置成原生搜索框样式
        textField.borderStyle = .roundedRect
        textField.clearButtonMode = .whileEditing
        
        return textField
    }
    
    func updateUIView(_ uiView: UITextField, context: Context) {
        uiView.text = text
    }
    
    func makeCoordinator() -> Coordinator {
        Coordinator(self)
    }
    
    class Coordinator: NSObject, UITextFieldDelegate {
        let parent: CustomSearchTextField
        
        init(_ parent: CustomSearchTextField) {
            self.parent = parent
        }
        
        // 处理返回/搜索键点击事件
        func textFieldShouldReturn(_ textField: UITextField) -> Bool {
            parent.text = textField.text ?? ""
            textField.resignFirstResponder() // 收起键盘
            return true
        }
        
        // 同步输入内容到SwiftUI的绑定变量
        func textFieldDidChangeSelection(_ textField: UITextField) {
            parent.text = textField.text ?? ""
        }
    }
}

在SwiftUI视图中使用 #

直接像调用原生TextField一样使用这个自定义组件：

struct ContentView: View {
    @State private var searchText = ""
    
    var body: some View {
        VStack(spacing: 20) {
            CustomSearchTextField(
                text: $searchText,
                placeholder: "搜索...",
                returnKeyType: .search
            )
            .frame(width: 300)
            
            Text("输入内容：\(searchText)")
        }
        .padding()
    }
}

补充说明 #

• enablesReturnKeyAutomatically是UIKit原生属性，完全遵循iOS系统的交互逻辑，不需要自己写复杂的空值判断。
• 如果需要自定义键盘类型、输入框样式，直接在makeUIView方法里给UITextField添加对应配置即可。
• Coordinator负责同步SwiftUI状态和UIKit输入框内容，同时处理返回键的点击回调，保证逻辑闭环。

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