programming
swiftui
swift
input-handling-in-ios-18
forms-handling-in-ios-18
swift-tutorial
swift-for-beginners
30daysofswift
30-days-of-swift
Формы и обработка ввода в iOS 18 - #30DaysOfSwift
2 ноября 2024 г.День 24: Разработка форм и обработка проверки ввода пользователя 📋
Давайте сегодня перейдем к основам, создав формы и обработав вводимые пользователем данные вSwiftUI. Формы являются основной частью многих приложений для сбора данных от пользователей.
Давайте начнем!
Код
SwiftUIобеспечиваетFormконтейнер, позволяющий легко создавать удобные формы ввода.
import SwiftUI
struct UserFormView: View {
@State private var username = ""
@State private var email = ""
@State private var password = ""
@State private var errorMessage = ""
var body: some View {
Form {
// Username Input
Section(header: Text("Username")) {
TextField("Enter your username", text: $username)
.autocapitalization(.none)
.disableAutocorrection(true)
.textFieldStyle(RoundedBorderTextFieldStyle())
}
// Email Input
Section(header: Text("Email")) {
TextField("Enter your email", text: $email)
.autocapitalization(.none)
.keyboardType(.emailAddress)
.disableAutocorrection(true)
.textFieldStyle(RoundedBorderTextFieldStyle())
}
// Password Input
Section(header: Text("Password")) {
SecureField("Enter your password", text: $password)
.textFieldStyle(RoundedBorderTextFieldStyle())
}
// Error Message
if !errorMessage.isEmpty {
Text(errorMessage)
.foregroundColor(.red)
}
// Submit Button
Button(action: {
validateForm()
}) {
Text("Submit")
.frame(maxWidth: .infinity)
.padding()
.background(Color.blue)
.foregroundColor(.white)
.cornerRadius(8)
}
}
.navigationTitle("User Form")
}
// Step 3: Validate the form inputs
func validateForm() {
if username.isEmpty || email.isEmpty || password.isEmpty {
errorMessage = "All fields are required!"
} else if !email.contains("@") {
errorMessage = "Invalid email address!"
} else if password.count < 6 {
errorMessage = "Password must be at least 6 characters!"
} else {
errorMessage = ""
// Handle successful form submission (e.g., save data)
}
}
}
Полная серия доступна в моем профиле, а компоненты также можно найти на сайте
Удачного кодирования!
Оригинал