SwiftUI 简约教程（28）：TextEditor 多行文本框指南

在 SwiftUI 中构建强大的多行文本输入框：深入探索 TextEditor

了解 TextEditor 多行文本框

TextEditor 是 SwiftUI 中的文本输入控件，可让你创建多行文本输入字段。通过设置 multiline 参数为 true，你可以轻松创建多行文本框，让用户能够轻松地输入和编辑多行的文本。默认情况下，文本编辑器会自动调整其大小以适应设备屏幕的宽度。

自适应高度

有时，根据文本内容自动调整文本编辑器的高度非常有用。使用 frame(height:) 修饰符并将其高度设置为 .frame(minHeight: 0) 可实现此目的。这将创建一个高度自动调整的多行文本编辑器，能够容纳任意数量的行，而不会影响可用空间。

文本输入验证

验证用户输入以确保其满足特定要求至关重要。TextEditor 提供了 onReceive() 修饰符，可在文本更改时进行验证。例如，你可以检查文本长度或是否存在特定模式。如果验证失败，你可以显示错误消息或采取其他纠正措施。

高级自定义

TextEditor 提供广泛的自定义选项，可满足你的具体需求。你可以使用 foregroundColor()、font() 和 text 等修饰符来更改文本外观。你还可以使用 disableAutocorrection() 和 autocapitalization() 等修饰符来控制文本输入行为。

示例代码

struct CustomTextEditor: View {
    @State private var text = ""
    
    var body: some View {
        TextEditor(text: $text)
            .frame(height: 100)
            .foregroundColor(.green)
            .font(.headline)
            .disableAutocorrection(true)
            .autocapitalization(.none)
    }
}

这段代码创建一个具有自定义样式的多行文本编辑器，其中文本为绿色、字体为标题，并禁用了自动更正和自动大写。

常见问题解答

1. 如何限制文本输入长度？
你可以使用 onReceive() 修饰符并检查文本长度。如果超出限制，你可以截断文本或显示错误消息。

2. 如何在文本编辑器中添加占位符文本？
使用 placeholder() 修饰符来设置占位符文本。这将显示一个提示文本，当文本编辑器为空时显示，当用户开始输入时隐藏。

3. 如何禁用文本编辑器？
设置 isEditable 参数为 false 以禁用文本编辑器。这将阻止用户编辑文本，但仍允许他们选择或复制文本。

4. 如何在文本编辑器中设置初始文本？
使用 text 参数来设置文本编辑器的初始文本。这允许你预先填充文本，以便用户可以继续编辑。

5. 如何检测文本编辑器中的文本更改？
onEditingChanged(_:) 修饰符允许你在文本编辑器开始或结束编辑时执行操作。这可以用于跟踪更改或启用/禁用其他控件。

结论

TextEditor 多行文本框是创建交互式且高效的文本输入控件的有力工具。通过了解其功能和自定义选项，你可以构建满足各种需求的多行文本编辑器。通过掌握 TextEditor，你将使你的应用程序能够轻松、准确地输入和编辑多行文本。