我有个问题我有几个文本编辑器的视图。输入其中任何一个都会改变所有这些元素的高度。
你知道会发生什么以及如何解决吗?
示例编码:
import SwiftUI
struct TestingView: View {
@State var optionA = ""
@State var optionB = ""
@State private var comment = ""
var body: some View {
NavigationStack {
Form {
VStack() {
CustomRow(title: "Option A", value: $optionA)
CustomRow(title: "Option B", value: $optionB)
}
.padding(.vertical, 20)
}
.navigationTitle("Testing View")
.padding(.zero)
}
}
}
struct CustomRow: View {
var title: String = ""
@Binding var value: String
var body: some View {
VStack(alignment: .leading) {
Text(title)
.font(.system(.headline, design: .rounded))
.foregroundColor(.gray)
.listRowSeparator(.hidden)
ZStack {
TextEditor(text: $value)
.padding(4)
.autocapitalization(.none)
.disableAutocorrection(true)
.textFieldStyle(.roundedBorder)
.font(.system(.body, design: .rounded))
.frame(minHeight: 50, maxHeight: 200)
}
.overlay(
RoundedRectangle(cornerRadius: 4)
.stroke(.gray, lineWidth: 1)
)
}
.padding(.bottom, 10)
}
}
struct TestingView_Previews: PreviewProvider {
static var previews: some View {
TestingView()
}
}
1条答案
按热度按时间s5a0g9ez1#
我认为这是因为
VStack
试图通过沿着垂直轴均匀分布视图来布局视图,只要可能。由于您为文本编辑器提供了一个介于50到200之间的灵活高度,因此可以拉伸它们,使两个文本编辑器的高度相等。通过反复试验,您可以通过向
VStack
添加垂直fixedSize
来解决此问题:但我只需要将它作为表单的两个单独的行,并隐藏列表分隔符。如果您想要垂直填充,请将它们分别添加到每个
CustomRow
: