19.11.2024

Aula 79: Construindo Formulários e Validação de Entrada do Usuário em Swift

Nesta aula, exploraremos como criar formulários em Swift, com foco na validação da entrada do usuário. Os formulários são essenciais para coletar informações dos usuários em muitas aplicações, e garantir que os dados inseridos sejam válidos é crucial para manter a integridade dos dados.

Criando uma Interface de Formulário Simples

Começaremos construindo uma interface de formulário simples usando o UIKit. Para este exemplo, vamos criar um formulário de registro de usuário que coleta o nome, o e-mail e a senha de um usuário.

Passo 1: Configurando a UI

Crie um novo projeto iOS no Xcode e use o seguinte código para configurar uma interface básica.

import UIKit

class RegistrationViewController: UIViewController {

    let nameTextField = UITextField()
    let emailTextField = UITextField()
    let passwordTextField = UITextField()
    let registerButton = UIButton()

    override func viewDidLoad() {
        super.viewDidLoad()
        setupUI()
    }

    func setupUI() {
        view.backgroundColor = .white

        // Configura o campo de texto para o nome
        nameTextField.placeholder = "Nome"
        nameTextField.borderStyle = .roundedRect
        view.addSubview(nameTextField)

        // Configura o campo de texto para o e-mail
        emailTextField.placeholder = "E-mail"
        emailTextField.borderStyle = .roundedRect
        view.addSubview(emailTextField)

        // Configura o campo de texto para a senha
        passwordTextField.placeholder = "Senha"
        passwordTextField.borderStyle = .roundedRect
        passwordTextField.isSecureTextEntry = true
        view.addSubview(passwordTextField)

        // Configura o botão de registro
        registerButton.setTitle("Registrar", for: .normal)
        registerButton.backgroundColor = .blue
        registerButton.addTarget(self, action: #selector(registerButtonTapped), for: .touchUpInside)
        view.addSubview(registerButton)

        // Layout
        nameTextField.translatesAutoresizingMaskIntoConstraints = false
        emailTextField.translatesAutoresizingMaskIntoConstraints = false
        passwordTextField.translatesAutoresizingMaskIntoConstraints = false
        registerButton.translatesAutoresizingMaskIntoConstraints = false

        NSLayoutConstraint.activate([
            nameTextField.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 20),
            nameTextField.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20),
            nameTextField.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20),

            emailTextField.topAnchor.constraint(equalTo: nameTextField.bottomAnchor, constant: 20),
            emailTextField.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20),
            emailTextField.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20),

            passwordTextField.topAnchor.constraint(equalTo: emailTextField.bottomAnchor, constant: 20),
            passwordTextField.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20),
            passwordTextField.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20),

            registerButton.topAnchor.constraint(equalTo: passwordTextField.bottomAnchor, constant: 30),
            registerButton.centerXAnchor.constraint(equalTo: view.centerXAnchor)
        ])
    }
}

Passo 2: Adicionando Validação de Entrada

Agora, vamos implementar uma função para validar a entrada do usuário quando ele clicar no botão de registro.

@objc func registerButtonTapped() {
    guard let name = nameTextField.text, !name.isEmpty else {
        showAlert(message: "O nome não pode estar vazio.")
        return
    }

    guard let email = emailTextField.text, isValidEmail(email) else {
        showAlert(message: "Por favor, insira um endereço de e-mail válido.")
        return
    }

    guard let password = passwordTextField.text, password.count >= 6 else {
        showAlert(message: "A senha deve ter pelo menos 6 caracteres.")
        return
    }

    // Se todas as validações forem aprovadas
    // Prossiga com a lógica de registro, como enviar os dados para o servidor
    print("Registro realizado com sucesso para \(name) com o e-mail \(email).")
}

func showAlert(message: String) {
    let alertController = UIAlertController(title: "Erro de Validação", message: message, preferredStyle: .alert)
    alertController.addAction(UIAlertAction(title: "OK", style: .default, handler: nil))
    present(alertController, animated: true, completion: nil)
}

Passo 3: Função de Validação de E-mail

A função de validação de e-mail é uma parte crucial para garantir a correção da entrada do e-mail. Abaixo está um método simples de validação baseado em regex.

func isValidEmail(_ email: String) -> Bool {
    let emailRegEx = "[A-Z0-9a-z._%+-]+@[A-Za-z0-9.-]+\\.[A-Z|a-z]{2,}"
    let emailTest = NSPredicate(format: "SELF MATCHES %@", emailRegEx)
    return emailTest.evaluate(with: email)
}

Conclusão

Nesta aula, construímos um formulário de registro de usuário simples usando o UIKit e implementamos a validação da entrada para os campos. Entender como coletar e validar a entrada do usuário é vital em qualquer aplicação móvel para garantir a integridade dos dados e fornecer feedback aos usuários quando sua entrada é inválida.

Essa é uma habilidade fundamental que pode ser expandida com formulários mais complexos e regras de validação variadas conforme necessário. Você pode aprimorar ainda mais isso adicionando mais campos, usando bibliotecas de terceiros para validação ou até mesmo integrando com um serviço de backend para registro de usuários. Boa codificação!

Video

Navigation