[UIKit/codebase] TableView 기본 기능 구현 방법

1. TableView 추가하기

import UIKit

class ViewController: UIViewController {
    private let tableView = UITableView()

    override func viewDidLoad() {
        super.viewDidLoad()

        setupTableView()
    }

    private func setupTableView() {
        view.addSubview(tableView)
        tableView.translatesAutoresizingMaskIntoConstraints = false

        NSLayoutConstraint.activate([
            tableView.topAnchor.constraint(equalTo: view.topAnchor),
            tableView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
            tableView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            tableView.trailingAnchor.constraint(equalTo: view.trailingAnchor)
        ])

        tableView.delegate = self
        tableView.dataSource = self
    }
}

 

2. UITableViewDelegate, UITableViewDataSource 채택하기

extension ViewController: UITableViewDelegate, UITableViewDataSource {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 20 // 데이터 개수
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = UITableViewCell(style: .default, reuseIdentifier: "cell")
        cell.textLabel?.text = "Row \(indexPath.row)" // 기본 제공되는 UILabel에 텍스트를 설정
        return cell
    }
}

 

 

이렇게 하면 기본  UITableViewCell을 사용하게 된다.

커스텀 TableViewCell을 구현해서 사용해보자.

 

3. UITableViewCell 구현하기

UITableViewCell을 상속하여 원하는 Cell을 구현한다.

class CustomTableViewCell: UITableViewCell {
    private let titleLabel = UILabel()

    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        setupUI()
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    private func setupUI() {
        contentView.addSubview(titleLabel)
        titleLabel.translatesAutoresizingMaskIntoConstraints = false

        NSLayoutConstraint.activate([
            titleLabel.centerYAnchor.constraint(equalTo: contentView.centerYAnchor),
            titleLabel.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 16)
        ])
    }

    func configure(with text: String) {
        titleLabel.text = text
    }
}

 

4. 구현한 셀을 등록하기

이제 기존의 ViewController에서 tableView.Register 메서드를 통해 구현한 셀 등록

private func setupTableView() {
    view.addSubview(tableView)
    tableView.translatesAutoresizingMaskIntoConstraints = false
    tableView.register(CustomTableViewCell.self, forCellReuseIdentifier: "CustomCell")

    NSLayoutConstraint.activate([
        tableView.topAnchor.constraint(equalTo: view.topAnchor),
        tableView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
        tableView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
        tableView.trailingAnchor.constraint(equalTo: view.trailingAnchor)
    ])

    tableView.delegate = self
    tableView.dataSource = self
}

 

tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) 메서드 수정

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "CustomCell", for: indexPath) as! CustomTableViewCell
    cell.configure(with: "Row \(indexPath.row)")
    return cell
}​

 

여기서 dequeueReusableCell()은 미리 생성한 셀을 재사용하여 구현하겠다는 의미.