删除表单 SwiftUI 中的行
Remove row in form SwiftUI
我有一个表单,如果用户没有向电子邮件和密码字段提供足够的凭据,则会显示提示。问题是提示在它们存在的地方(在电子邮件和密码下)创建了一个额外的行。
我尝试隐藏分隔符,但我留下了 space 的巨大差距。有没有一种方法可以删除列表行,并在文本出现时让每个元素向下移动?密码提示并不那么明显,因为按钮和行之间仍然有 space。
NavigationView{
ZStack{
Form{
Section(){
TextField("FirstName", text: $userInformation.firstname)
TextField("LastName", text: $userInformation.lastname)
TextField("Email", text: $userInformation.email)
Text(userInformation.emailPrompt)
.font(.caption).italic().foregroundColor(.red)
.listStyle(.inset)
SecureField("Passsword", text: $userInformation.password
).autocapitalization(.none)
Text(userInformation.passwordPrompt)
.font(.caption).italic().foregroundColor(.red)
}
.listRowBackground(Color.clear)
.padding()
.navigationBarTitle(Text("Lets Get Started"))
.navigationBarTitleDisplayMode(.automatic)
.font(.system(size:18))
.listStyle(GroupedListStyle())
}
NavigationLink(destination: JournalEntryMain() .navigationBarHidden(true)){
Text("Sign Up")
.frame(width: 250, height: 20)
.foregroundColor(.white)
.padding()
// .multilineTextAlignment(.leading)
.background(LinearGradient(gradient: Gradient(colors: [.orange, .pink]), startPoint: .leading, endPoint: .bottom))
.font(.title3)
.background(.clear)
.cornerRadius(5)
.offset(y:30)
.opacity(userInformation.isSignUpComplete ? 1 : 0.5)
}
class FormViewModel: ObservableObject {
@Published var firstname = ""
@Published var lastname = ""
@Published var email = ""
@Published var gender = ""
@Published var password = ""
func isPasswordValid() -> Bool {
let passwordTest = NSPredicate(format: "SELF MATCHES%@", "^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,15}$")
return passwordTest.evaluate(with: password)
}
func isEmailValid() -> Bool {
let emailTest = NSPredicate(format: "SELF MATCHES%@", "^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$")
return emailTest.evaluate(with: email)
}
//email and password prompts if incomplete or incorrect
var emailPrompt: String {
if isEmailValid() || email == "" {
return ""
} else {
return "*Please enter a valid email address"
}
}
var passwordPrompt: String {
if isPasswordValid() || password == ""{
return ""
} else {
return "*Password must be 8-15 letters, with atleast one uppercase and one number"
}
}
var isSignUpComplete: Bool {
if !isPasswordValid() || !isEmailValid() || firstname == "" || lastname == "" {
return false
}
return true
}
}
最简单的方法是有条件的:
if userInformation.passwordPrompt != "" {
Text(userInformation.passwordPrompt)
.font(.caption).italic().foregroundColor(.red)
}
这将有条件地将其从视图中删除。您还可以为 appearance/disappearance.
设置动画
我有一个表单,如果用户没有向电子邮件和密码字段提供足够的凭据,则会显示提示。问题是提示在它们存在的地方(在电子邮件和密码下)创建了一个额外的行。
我尝试隐藏分隔符,但我留下了 space 的巨大差距。有没有一种方法可以删除列表行,并在文本出现时让每个元素向下移动?密码提示并不那么明显,因为按钮和行之间仍然有 space。
NavigationView{
ZStack{
Form{
Section(){
TextField("FirstName", text: $userInformation.firstname)
TextField("LastName", text: $userInformation.lastname)
TextField("Email", text: $userInformation.email)
Text(userInformation.emailPrompt)
.font(.caption).italic().foregroundColor(.red)
.listStyle(.inset)
SecureField("Passsword", text: $userInformation.password
).autocapitalization(.none)
Text(userInformation.passwordPrompt)
.font(.caption).italic().foregroundColor(.red)
}
.listRowBackground(Color.clear)
.padding()
.navigationBarTitle(Text("Lets Get Started"))
.navigationBarTitleDisplayMode(.automatic)
.font(.system(size:18))
.listStyle(GroupedListStyle())
}
NavigationLink(destination: JournalEntryMain() .navigationBarHidden(true)){
Text("Sign Up")
.frame(width: 250, height: 20)
.foregroundColor(.white)
.padding()
// .multilineTextAlignment(.leading)
.background(LinearGradient(gradient: Gradient(colors: [.orange, .pink]), startPoint: .leading, endPoint: .bottom))
.font(.title3)
.background(.clear)
.cornerRadius(5)
.offset(y:30)
.opacity(userInformation.isSignUpComplete ? 1 : 0.5)
}
class FormViewModel: ObservableObject {
@Published var firstname = ""
@Published var lastname = ""
@Published var email = ""
@Published var gender = ""
@Published var password = ""
func isPasswordValid() -> Bool {
let passwordTest = NSPredicate(format: "SELF MATCHES%@", "^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,15}$")
return passwordTest.evaluate(with: password)
}
func isEmailValid() -> Bool {
let emailTest = NSPredicate(format: "SELF MATCHES%@", "^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$")
return emailTest.evaluate(with: email)
}
//email and password prompts if incomplete or incorrect
var emailPrompt: String {
if isEmailValid() || email == "" {
return ""
} else {
return "*Please enter a valid email address"
}
}
var passwordPrompt: String {
if isPasswordValid() || password == ""{
return ""
} else {
return "*Password must be 8-15 letters, with atleast one uppercase and one number"
}
}
var isSignUpComplete: Bool {
if !isPasswordValid() || !isEmailValid() || firstname == "" || lastname == "" {
return false
}
return true
}
}
最简单的方法是有条件的:
if userInformation.passwordPrompt != "" {
Text(userInformation.passwordPrompt)
.font(.caption).italic().foregroundColor(.red)
}
这将有条件地将其从视图中删除。您还可以为 appearance/disappearance.
设置动画