[Swift] UITabelView에 .xib커스텀 셀을 적용해보기

TableView개발에 있어서 .xib 파일 형식의 커스텀 셀을 활용해보겠습니다. 

.xib 파일 형식을 활용하면 재활용성이 좋아 자주 사용하고 있습니다.

(뭔가 부품을 만들어 조합한다는 느낌??)

스토리보드에서의 작업보다는 몇 가지 추가 작업이 필요하지만 그렇게 복잡한 작업은 아니기 때문에 따라 하시는데도 별로 어려움을 없을 것입니다.

---

1. Storyboard에 TableView 생성

storyboard에서 tableView를 생성합니다.

2. TableView 설정

빠르게 테이블 뷰를 나타내기 위한 설정을 진행합니다.

(delegate나 datasource설정은 예시를 보여 드리는 것이기 때문에 최소한 만을 사용하여 나타내었습니다.)

   @IBOutlet weak var tableView: UITableView!

    

    override func viewDidLoad() {

        super.viewDidLoad()

        

        self.tableView.delegate = self

        self.tableView.dataSource = self

    }

    

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

        return 5

    }

    

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        return UITableViewCell()

    }

3. 커스텀 셀 생성

이제 이번 주제의 본격적인 커스텀 셀을 생성해 보겠습니다. 

생성 시, [Also create XLB file] 에 체크를 하고 생성하시면 (.swift .xib) 두 가지의 파일이 생성이 됩니다. 

그리고 기본적으로 .xib파일과 .swift파일은 연결이 되어있을 것입니다.

체크를 넣어주세요

4. 커스텀 셀 구성

이번 단계에서는 자신이 원하는 디자인으로 어떻게 구성할 것 인지 자유롭게 제작하시면 됩니다.

5. TableView와 연결하기

마무리 단계인 연결입니다. 연결하기 전에 커스텀 셀의 id를 적당히 정해주신 뒤 아래와 같은 코드로 연결시킬 수 있습니다.

Identifier 에 자유롭게 id를 설정해 줍니다.

   @IBOutlet weak var tableView: UITableView!

    

    override func viewDidLoad() {

        super.viewDidLoad()

        

        self.tableView.delegate = self

        self.tableView.dataSource = self

       // 추가

        let nibName = UINib(nibName: "TableViewCell", bundle: nil)

        tableView.register(nibName, forCellReuseIdentifier: "customCell")

        // 추가

    }

    

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

        return 5

    }

    

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

       // 수정

        let cell = tableView.dequeueReusableCell(withIdentifier: "customCell", for: indexPath) as! TableViewCell

        return cell

        // 수정

    }

 

이번 글에서는 .xib 파일을 사용한 커스텀 셀 활용하기에 대해 알아보았습니다. 이번 코드는 어디까지나 제가 사용하는 코드이고 적용하는 방법은 다양하게 있습니다. 간단한 작업이었지만 도움이 되었으면 좋겠습니다.

지적이나 추가사항은 댓글로 알려주시면 감사하겠습니다.

---

환경 

Xcode 11.3

swift 5