xib를 사용하여 TableView 구현하기!

1. xib 파일 생성하기

• 1) 기존에 UITableViewCell파일을 만든 것처럼 NewFile을 눌러주세요.

• 2) 이름을 적고, Also create XIB file을 체크해주세요.

  

이렇게 생성하시면

이렇게 .swift파일과 .xib파일이 만들어져있습니다. xib파일을 클릭합니다.

보기와 같이 cell이 만들어졌습니다.

간단하게 image와 label 하나씩 넣었습니다.

2. IBOutlet을 연결하기

- 1) xib 셀의 이미지뷰와 label의 IBOutlet을 xib 생성시 함께 만들어진 swift파일에 연결시켜준다.

- 2) storyboard의 TableView를ViewController와 IBOutlet으로 연결시켜줍니다.

3. identifier을 설정하기

원래는 TableViewCell class도 함께 지정을 해주어야 하지만, xib로 만들면 자동으로 지정이 되어있기 때문에 이 과정은 생략합니다.

4. TableView와 TableViewCell 연결하기

ViewController의 viewDidLoad에서 xib 셀을 등록해준다.

    let nib = UINib(nibName: "XibTableViewCell",bundle: nil)
        
    override func viewDidLoad() {
        super.viewDidLoad()
        
        tableView.register(nib, forCellReuseIdentifier: "dogCell")
        }

4. DataSource 메소드들을 현하기

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 10
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        guard let cell = tableView.dequeueReusableCell(withIdentifier: "dogCell") as? XibTableViewCell else { return UITableViewCell() }
        return cell
    }

이제 시뮬레이터로 실행시키면 xib를 사용하지않고 tableView를 만들었을 때와 동일한 결과를 얻을수 있다.