SwiftUI中编辑TextField时如何将光标自动移动到文本末尾？

实现思路 #

SwiftUI原生TextField没有提供直接控制光标位置的API，所以可以通过桥接UIKit的UITextField，在文本框进入编辑状态（成为第一响应者）时，手动将光标偏移到文本末尾。

代码实现（支持iOS13及以上版本） #

import SwiftUI
import UIKit

struct CursorEndTextField: UIViewRepresentable {
    @Binding var text: String
    let placeholder: String
    
    func makeCoordinator() -> Coordinator {
        Coordinator(self)
    }
    
    func makeUIView(context: Context) -> UITextField {
        let textField = UITextField()
        textField.placeholder = placeholder
        textField.delegate = context.coordinator
        // 可根据需求自定义其他UITextField属性，比如字体、边框样式等
        textField.font = .systemFont(ofSize: 16)
        textField.borderStyle = .roundedRect
        return textField
    }
    
    func updateUIView(_ uiView: UITextField, context: Context) {
        uiView.text = text
    }
    
    class Coordinator: NSObject, UITextFieldDelegate {
        var parent: CursorEndTextField
        
        init(_ parent: CursorEndTextField) {
            self.parent = parent
        }
        
        func textFieldDidBeginEditing(_ textField: UITextField) {
            // 进入编辑状态时将光标定位到文本末尾
            DispatchQueue.main.async {
                let endPosition = textField.endOfDocument
                textField.selectedTextRange = textField.textRange(from: endPosition, to: endPosition)
            }
        }
        
        // 可选实现：如果需要禁止用户编辑过程中手动移动光标，可打开下方代码
        // func textFieldDidChangeSelection(_ textField: UITextField) {
        //     DispatchQueue.main.async {
        //         let endPosition = textField.endOfDocument
        //         textField.selectedTextRange = textField.textRange(from: endPosition, to: endPosition)
        //     }
        // }
        
        func textFieldShouldReturn(_ textField: UITextField) -> Bool {
            textField.resignFirstResponder()
            return true
        }
        
        func textFieldDidEndEditing(_ textField: UITextField) {
            parent.text = textField.text ?? ""
        }
    }
}

使用示例 #

struct ContentView: View {
    @State private var inputText = "默认文本内容"
    
    var body: some View {
        VStack(spacing: 20) {
            CursorEndTextField(text: $inputText, placeholder: "请输入内容")
                .padding(.horizontal)
            Text("输入内容：\(inputText)")
        }
        .padding()
    }
}

注意事项 #

• 代码中DispatchQueue.main.async是为了避免和系统默认的光标定位逻辑冲突，确保自定义的光标偏移逻辑生效
• 如果仅适配iOS15及以上版本，也可以配合@FocusState监听输入框聚焦状态实现效果，上述桥接方案兼容性更强、可控性更高

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