[iOS] 테이블 뷰 헤더 커스텀하기

헤더의 표현 방식과 커스터마이징이 가능한 viewForHeaderInSection에 대해 알아보자.

titleForHeaderInSection vs viewForHeaderInSection

1. titleForHeaderInSection

역할

• 섹션의 헤더 텍스트(기본 스타일)를 설정합니다.
• 간단한 문자열만 표시할 때 사용합니다.

func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
    return section == 0 ? "기본 섹션" : "최근 항목"
}

특징:

• 기본 디자인 제공
  • 텍스트만 표시 가능 (폰트, 색상, 배경 등 커스터마이징 불가).
• 간단한 구성에 적합
  • 헤더에 텍스트만 필요한 경우 쉽게 사용 가능.
• 자동 높이 조절
  • 텍스트 크기에 맞게 높이가 자동 조정됨.

---

2. viewForHeaderInSection

역할

• 커스텀 뷰를 섹션 헤더로 제공합니다.
• 헤더의 레이아웃과 디자인을 완전히 사용자 정의할 수 있습니다.

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let headerView = UIView()
    headerView.backgroundColor = .black
    
    let label = UILabel()
    label.text = section == 0 ? "기본 섹션" : "최근 항목"
    label.font = UIFont.boldSystemFont(ofSize: 20)
    label.textColor = .white
    
    headerView.addSubview(label)
    label.snp.makeConstraints { make in
        make.leading.equalToSuperview().offset(16)
        make.centerY.equalToSuperview()
    }
    
    return headerView
}

특징

• 디자인 자유도
  • 배경색, 폰트, 이미지, 버튼 등 원하는 레이아웃을 구성 가능.
• 명시적 높이 설정 필요
  • heightForHeaderInSection 메서드로 높이를 직접 지정해야 함.
• 복잡한 UI 구성에 적합
  • 텍스트 외에 아이콘, 버튼 등을 추가할 수 있음.

---