테이블뷰란?
테이블뷰는 iOS 애플리케이션에서 많이 활용하는 사용자 인터페이스입니다. 테이블뷰는 리스트 형태를 지니고 있으며 스크롤이 가능해 많은 정보를 보여 줄 수 있습니다. 다양한 용도로 사용하는 테이블뷰의 특징과 구성요소에 대해 알아보도록 합시다.
테이블뷰 기본 형태
이미 다양한 iOS 애플리케이션에서 만나 익숙한 테이블뷰의 형태에 대해 구체적으로 알아보도록 합시다.
- 테이블뷰는 하나의 열(column)과 여러 줄의 행(row)을 지니며, 수직으로만 스크롤 가능합니다.
- 각 행은 하나의 셀(cell)에 대응합니다. (셀에 대해서는 다음 시간에 자세히 배워볼 거예요!)
- 섹션(section)을 이용해 행을 시각적으로 나눌 수 있습니다.
- 헤더(header)와 푸터(footer)에 이미지나 텍스트를 추가해 추가 정보를 보여줄 수 있습니다.
테이블뷰 스타일
테이블뷰는 크게 두 가지 스타일(일반, 그룹)로 나뉩니다. 각 테이블뷰의 특징에 대해 살펴봅시다.
- 일반 테이블뷰(Plain TableView)
- 더 이상 나뉘지 않는 연속적인 행의 리스트 형태입니다.
- 하나 이상의 섹션을 가질 수 있으며, 각 섹션은 여러 개의 행을 지닐 수 있습니다.
- 각 섹션은 헤더 혹은 푸터를 옵션으로 지닐 수 있습니다.
- 색인을 이용한 빠른 탐색을 하거나 옵션을 선택할 때 용이합니다.
- 그룹 테이블뷰(Grouped TableView):
- 섹션을 기준으로 그룹화되어있는 리스트 형태입니다.
- 하나 이상의 섹션을 가질 수 있으며, 각 섹션은 여러 개의 행을 지닐 수 있습니다.
- 각 섹션은 헤더 혹은 푸터를 옵션으로 지닐 수 있습니다.
- 정보를 특정 기준에 따라 개념적으로 구분할 때 적합합니다.
- 사용자가 정보를 빠르게 이해하는 데 도움이 됩니다.
아래 이미지는 완전히 같은 테이블뷰를 스타일만 일반/그룹으로 나타낸 것입니다.
테이블뷰 생성
테이블뷰를 생성하고 관리하는 좋은 방법은 스토리보드에서 커스텀 UITableViewController 클래스의 객체를 이용하는 것입니다(필요에 따라서 소스코드로 테이블뷰를 생성하는 것도 물론 가능합니다). 스토리보드에서 테이블뷰의 특성을 지정할 때, 동적 프로토타입(dynamic prototypes) 혹은 정적 셀(static cells) 중 하나를 선택할 수 있습니다. 새로운 테이블뷰를 생성할 때 기본 설정 값은 동적 프로토타입으로, 앞으로 진행할 프로젝트에서는 동적 프로토타입을 사용할 것입니다.
- 동적 프로토타입(Dynamic Prototypes)
- 셀 하나를 디자인해 이를 다른 셀의 템플릿으로 사용하는 방식
- 같은 레이아웃의 셀을 여러 개 이용해 정보를 표시할 경우
- 데이터 소스(UITableViewDataSource) 인스턴스에 의해 콘텐츠를 관리하며, 셀의 개수가 상황에 따라 변하는 경우에 사용
- 정적 셀(Static Cells)
- 고유의 레이아웃과 고정된 수의 행을 가지는 테이블뷰에 사용
- 테이블뷰를 디자인하는 시점에 테이블의 형태와 셀의 개수가 정해져 있는 경우 사용
- 셀의 개수가 변하지 않음
테이블뷰 구성요소