[iOS] Swift 회원가입 화면 만들기

안녕하세요. 김배추입니다. 

이 글은 제가 공부했던 내용을 기록하기 위해 작성되었습니다.

부족한 점이 있다면 댓글로 지적해주시면 감사하겠습니다.

 

 

스토리보드 구성

---

저는 이렇게 로그인과 회원가입을 구성했습니다.

왼쪽 화면에서 임시버튼은 제가 테스트를 위해 만든 버튼이고, 오른쪽화면에서 선택사항은 입력하지 않아도 회원가입이 가능합니다.

 

회원가입창의 모양이 왼쪽 화면과 다른데 아래와 같이 설정하시면 오른쪽 화면과 같이 변경할 수 있습니다.

 

회원가입은 필수로 작성해야하는 필드가 있습니다.

    class SignUpVC: UIViewController {

      var essentialFieldList = [UITextField]()
      @IBOutlet weak var scrollView: UIScrollView!

      @IBOutlet weak var idField: UITextField!
      @IBOutlet weak var passwordField: UITextField!
      @IBOutlet weak var passwordCheckField: UITextField!
      @IBOutlet weak var nameField: UITextField!
      @IBOutlet weak var phoneNumField: UITextField!
      @IBOutlet weak var mailField: UITextField!

      @IBOutlet weak var companyNameField: UITextField!
      @IBOutlet weak var licenseNumField: UITextField!
      
      override func viewDidLoad() {
        super.viewDidLoad()
        essentialFieldList = [idField, passwordField, passwordCheckField, nameField, phoneNumField, mailField]
    }
   }

저는 var essentialFieldList = [UITextField]() 에서 필수 체크를 했습니다.

 

    @IBAction func completeSignUp(_ sender: Any) {
        for field in essentialFieldList {
            if !isFilled(field) {
                signUpAlert(field)
                break
            }
        }
        
        guard let password = passwordField.text, let passwordCheck = passwordCheckField.text, password == passwordCheck else {
            passwordAlert(title: "비밀번호가 일치하지 않습니다.")
            return
        }
        postData()
    }

가입버튼을 누르면 essentialFieldList에 있는 각각의 UITextField가 작성되었는지 확인합니다. (아래에서 설명)

UITextField가 비워져있다면 경고창을 표시했습니다. (아래에서 설명)

비밀번호가 일치하지 않으면 비밀번호가 다르다는 경고창을 표시하고, 비밀번호가 같다면 회원가입(postData)을 진행합니다.

 

import UIKit

extension SignUpVC {
    func showInfoAlert(with message: String) {
        DispatchQueue.main.async {
            let alert = UIAlertController(title: "회원가입이 완료되었습니다.", message: message, preferredStyle: .alert)
            
            
            let okAction = UIAlertAction(title: "확인", style: .default) { (action) in
                self.presentingViewController?.dismiss(animated: true, completion: nil)
            }
            alert.addAction(okAction)
            
            self.present(alert, animated: true, completion: nil)
        }
        
    }
    
    func showErrorAlert(with message: String, title: String = "Error") {
        DispatchQueue.main.async {
            let alert = UIAlertController(title: title, message: message, preferredStyle: .alert)
            
            let okAction = UIAlertAction(title: "OK", style: .default, handler: nil)
            alert.addAction(okAction)
            
            self.present(alert, animated: true, completion: nil)
        }
    }
    
    func signUpAlert(_ field: UITextField) {
        DispatchQueue.main.async {
            var title = ""
            switch field {
            case self.idField:
                title = "아이디를 입력해주세요."
            case self.passwordField:
                title = "비밀번호를 입력해주세요."
            case self.passwordCheckField:
                title = "비밀번호를 확인해주세요."
            case self.nameField:
                title = "이름을 입력해주세요."
            case self.phoneNumField:
                title = "휴대폰 번호를 입력해주세요."
            case self.mailField:
                title = "이메일을 입력해주세요."
            default:
                title = "Error"
            }
            let controller = UIAlertController(title: title, message: nil, preferredStyle: .alert)
            let cancelAction = UIAlertAction(title: "닫기", style: .cancel) { (action) in
                
            }
            
            controller.addAction(cancelAction)
            self.present(controller, animated: true, completion: nil)
        }
    }
    
    func passwordAlert(title: String) {
        DispatchQueue.main.async {
            let controller = UIAlertController(title: title, message: nil, preferredStyle: .alert)
            let cancelAction = UIAlertAction(title: "닫기", style: .cancel) { (action) in
            }
            
            controller.addAction(cancelAction)
            self.present(controller, animated: true, completion: nil)
        }
    }
}

회원가입에서 UITextField에 따라서 다르게 메세지가 나올 수 있도록 switch 구문을 이용해서 표현했습니다.

비밀번호 입력과 회원가입 관련 Alert도 따로 만들어 놨습니다.

 

아래의 func을 통해서 UITextField가 작성되었는지 확인할 수 있습니다.

  func isFilled(_ textField: UITextField) -> Bool {
        guard let text = textField.text, !text.isEmpty else {
            return false
        }
        return true
    }