如何解决表单选取器看起来很奇怪SwiftUI
我正在尝试为我的应用程序设计一个注册/登录页面,但是当我尝试在表单中放置2个选择器时,该表单会填充其余的VStack,因此看起来很糟糕,如下面的屏幕快照所示。关于如何使它紧凑的想法,以便仅使选择器显示在表单内部而没有任何空白?
SwiftUI视图的代码如下。
import SwiftUI
struct SignUpView: View {
@State private var firstNameTextField = ""
@State private var lastNameTextField = ""
@State private var emailTextField = ""
@State private var passwordTextField = ""
@State private var phoneNumberTextField = ""
@State private var selectedGenderIndex = 0
@State private var selectedCountryIndex = 0
@Environment(\.presentationMode) private var presentationMode
@Binding var isSignedIn: Bool
var body: some View {
VStack {
Image("Logo")
.resizable()
.frame(width: 120,height: 120)
.padding(.top,25)
VStack {
HStack {
TextField("* First name",text: $firstNameTextField)
.textFieldStyle(RoundedBorderTextFieldStyle())
TextField("* Last name",text: $lastNameTextField)
.textFieldStyle(RoundedBorderTextFieldStyle())
}
.padding(.top)
TextField("* Email",text: $emailTextField)
.textFieldStyle(RoundedBorderTextFieldStyle())
SecureField("* Password",text: $passwordTextField)
.textFieldStyle(RoundedBorderTextFieldStyle())
TextField("Mobile number",text: $phoneNumberTextField)
.textFieldStyle(RoundedBorderTextFieldStyle())
}
if errorIsShown {
HStack {
Text("Please fill out the required fields.")
.foregroundColor(.red)
.font(Font.system(size: 12))
.padding(.bottom,2)
Spacer()
}
}
if emailWarningIsShown {
HStack {
Text("Please enter a valid email address.")
.foregroundColor(.red)
.font(Font.system(size: 12))
.padding(.bottom,2)
Spacer()
}
}
HStack {
Text("* required")
.font(Font.system(size: 12))
Spacer()
}
Form {
Picker(selection: $selectedGenderIndex,label: Text("Gender")) {
Text("Select").tag(0)
Text("Male").tag(1)
Text("Female").tag(2)
}
Picker(selection: $selectedCountryIndex,label: Text("Country")) {
Text("Select").tag(0)
Text("Country 1").tag(1)
Text("Country 2").tag(2)
Text("Country 3").tag(3)
}
}
Spacer()
}
.padding([.leading,.trailing],20)
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。