SwiftUI 文本字段高度

在 SwiftUI 中，我们可以使用 TextField 来实现文本输入功能。但有时候，我们可能需要调整文本字段的高度，以适应不同的输入需求。本文将介绍如何在 SwiftUI 中调整文本字段的高度。

默认高度

TextField 的默认高度是根据字体大小自动调整的，通常比较适合一般情况下的使用。我们可以通过如下代码添加一个文本字段：

var body: some View {
    TextField("请输入文字", text: $text)
        .padding()
        .border(Color.gray, width: 1)
}

这里使用了 padding 和 border 来给文本字段添加一些样式。运行时，文本输入框的高度应该和其他系统控件的高度相同。

调整高度

如果默认高度不能满足需求，我们可以使用 frame 来手动调整 TextField 的高度。例如，以下代码将 TextField 的高度调整为 50：

var body: some View {
    TextField("请输入文字", text: $text)
        .frame(height: 50)
        .padding()
        .border(Color.gray, width: 1)
}

这里我们使用 frame 方法设置 TextField 的高度为 50。运行时，文本输入框的高度应该变为 50。

自适应高度

如果我们需要文本字段的高度能够自适应输入内容的高度，可以结合 GeometryReader 和 UIViewRepresentable 来实现。首先创建一个 UITextView 的封装：

struct MultilineTextField: UIViewRepresentable {
    @Binding var text: String
    
    func makeUIView(context: Context) -> UITextView {
        let textView = UITextView()
        textView.isScrollEnabled = true
        textView.isEditable = true
        textView.isUserInteractionEnabled = true
        textView.text = text
        textView.textContainer.lineFragmentPadding = 0
        textView.textContainerInset = .zero
        return textView
    }
    
    func updateUIView(_ uiView: UITextView, context: Context) {
        uiView.text = text
    }
    
    static func dismantleUIView(_ uiView: UITextView, coordinator: ()) {
        // Do nothing
    }
}

这里我们创建了一个 MultilineTextField 的自定义视图，它包装了一个 UITextView。然后我们使用 GeometryReader 来获取现有视图的大小，并将其传递给 MultilineTextField：

var body: some View {
    GeometryReader { geometry in
        MultilineTextField(text: $text)
            .frame(height: geometry.size.height)
            .padding()
            .border(Color.gray, width: 1)
    }
}

在 body 属性中，我们首先使用 GeometryReader 获取现有视图的大小，然后创建一个 MultilineTextField 并设置其高度为视图大小。这样，在输入内容变化时，文本输入框的高度将自动调整以适应输入内容。

总结

在 SwiftUI 中，我们可以使用 TextField 来实现文本输入功能。我们可以手动调整文本字段的高度，或使用 UIViewRepresentable 实现自适应高度。根据不同的需求，选择合适的方法可以提高开发效率和用户体验。