macOS下TextField输入时光标自动跳至末尾问题求助

问题场景 #

在macOS Ventura 13.0.1搭配Xcode 14.1环境中，使用SwiftUI的NavigationSplitView+VStack包裹TextField时，会出现光标异常跳转问题：将光标定位到已有文本的起始位置输入内容，光标会立刻跳到文本末尾。

复现代码 #

struct ContentView: View {
    @State private var text = "DEFG"
    
    var body: some View {
        NavigationSplitView {
            Text("Sidebar")
        } detail: {
            VStack {
                TextField("Text", text: $text)
            }
        }
    }
}

复现步骤 #

• 启动应用，将光标移至TextField中文本"D"的前方；
• 输入任意字符（如"A"），光标自动跳转到文本末尾。

问题分析 #

这是SwiftUI在特定布局组合下的已知bug，并非代码疏漏。当TextField被嵌套在VStack中且处于NavigationSplitView的detail区域时，文本更新会触发布局重计算，导致光标位置被错误重置。

解决方案 #

方案1：给VStack添加固定尺寸约束 #

通过固定VStack的最小尺寸，避免布局重计算干扰光标位置：

struct ContentView: View {
    @State private var text = "DEFG"
    
    var body: some View {
        NavigationSplitView {
            Text("Sidebar")
        } detail: {
            VStack {
                TextField("Text", text: $text)
            }
            .frame(minWidth: 200, minHeight: 50) // 添加固定尺寸约束
        }
    }
}

方案2：封装原生UITextField替代SwiftUI TextField #

使用UIViewRepresentable封装原生UITextField，彻底绕过SwiftUI的布局bug：

struct FixedTextField: UIViewRepresentable {
    @Binding var text: String
    var placeholder: String
    
    func makeUIView(context: Context) -> UITextField {
        let textField = UITextField()
        textField.placeholder = placeholder
        textField.delegate = context.coordinator
        return textField
    }
    
    func updateUIView(_ uiView: UITextField, context: Context) {
        if uiView.text != text {
            uiView.text = text
        }
    }
    
    func makeCoordinator() -> Coordinator {
        Coordinator(text: $text)
    }
    
    class Coordinator: NSObject, UITextFieldDelegate {
        @Binding var text: String
        
        init(text: Binding<String>) {
            _text = text
        }
        
        func textFieldDidChangeSelection(_ textField: UITextField) {
            text = textField.text ?? ""
        }
    }
}

// 使用示例
struct ContentView: View {
    @State private var text = "DEFG"
    
    var body: some View {
        NavigationSplitView {
            Text("Sidebar")
        } detail: {
            VStack {
                FixedTextField(text: $text, placeholder: "Text")
            }
        }
    }
}

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