1. ViewController 이름 바꾸기

AppDelegate 파일 내에서 뷰 컨트롤러 이름 선택 - 우클릭 - Refactor - Rename

2. 그룹 생성하기

1) Files 그룹 생성

Xcode 프로젝트에는 우리에게 쓸모없는 파일들이 많이 있다. 이런 파일들을 정리해주기 위해 새 그룹을 만들어준다. 프로젝트 폴더를 우클릭하고 New Group without Folder 를 선택해준다. (New Group without Folder는 파일들을 정리하기 위한 가상의 디렉토리를 만들어준다.

AppDelegate와 ViewController 파일을 제외한 모든 파일들을 Files 그룹에 넣어준다.

2) Login 그룹 생성

이번에는 New Group with Folder을 선택해서 실제 물리적인 폴더를 생성한다. 이후 그룹명을 Login으로 바꾸고 LoginViewController 파일을 Login 그룹 안에 넣어준다. 이 그룹 안에는 로그인과 관련된 파일들이 저장될 것이다.

3. LoginView.swift 생성

LoginView.swift 파일 안에 다음과 같이 코드를 작성한다.

import Foundation
import UIKit

class LoginView: UIView {
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        
        style()
        layout()
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    override var intrinsicContentSize: CGSize {
        return CGSize(width: 200, height: 200)
    }
}

extension LoginView {
    
    func style() {
        translatesAutoresizingMaskIntoConstraints = false
    }
    
    func layout() {
        
    }
}

🤔 잠깐 정리하고 가기

• UIView: 화면의 직사각형 영역을 관리하는 객체
• intrinsicContentSize
  • 본질적인 내용의 크기
  • UILabel 등에서는 기본적으로 intrinsicContentSize 값을 가지고 있다.
  • view의 디폴트 크기를 정의한다.
  • 스토리보드에서 사용된다. 여기서는 필요가 없다고 한다..
• style(), layout()
  • 오토레이아웃을 위한 놈들(?)

custom view 또는 auto layout 관련 작업을 할 때는 반드시 translateAutoresizingMaskIntoConstrains = false 코드를 추가해주어야 한다.

4. LoginViewController에 LoginView 붙이기

import UIKit

class LoginViewController: UIViewController {
    
    let loginView = LoginView()

    override func viewDidLoad() {
        super.viewDidLoad()
        style()
        layout()
    }

}

extension LoginViewController {
    private func style() {
        loginView.translatesAutoresizingMaskIntoConstraints = false
    }
    
    private func layout() {
        view.addSubview(loginView)
    }
}

1) 오토레이아웃 constraint

layout 메소드에서 NSLayoutConstraint.activate([]) 메소드를 호출해준다. 이 메소드는 파라미터로 받는 배열 안에 있는 constraints를 모두 활성화(isActive)시켜준다.

NSLayoutConstraint.activate 메소드를 다음과 같이 채워준다.

				NSLayoutConstraint.activate([
            loginView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
            loginView.leadingAnchor.constraint(equalToSystemSpacingAfter: view.leadingAnchor, multiplier: 1),
            view.trailingAnchor.constraint(equalToSystemSpacingAfter: loginView.trailingAnchor, multiplier: 1)
        ])

• SystemSpacing은 뭐지?
  • 참고 링크: https://stackoverflow.com/questions/64808767/what-is-system-spacing-in-a-layout
  • iOS에서 1x == 8pts이다.
• 뷰의 trailingAnchor가 로그인뷰의 trailingAnchor 다음에 오니까 trailingAnchor는 반대로 view를 기준으로 오토레이아웃을 잡아준다.