[iOS] 📎 UITableView

 

UITableView?

 

테이블 뷰는 데이터를 리스트 형태로 지니고 있으며, 스크롤이 가능한 가장 기본적인 UI Component

• 테이블 뷰는하나의 열(col)과 여러 줄의 행(row)을 지니며, 수직으로만 스크롤 가능하다.
  
  
• 각 행은 하나의 cell에 대응한다.
  
  
• 섹션을 이용해 행을 그룹화하여 시각적으로 구분할 수 있다.
  
  
• 섹션의 헤더와 푸터에 이미지나 텍스트를 이용하여 추가적인 정보를 보여줄 수 있다.
  
  

UIScrollView를 상속받는다. 아이폰의 설정, 기본 연락처 앱이 TableView로 구현되어 있다.

기본 설정 앱과 같이 여러 개의 섹션으로 분리해 연관 있는 그룹화해서 표시할 수 있고

연락처 앱과 같이 섹션 헤더를 사용해 알파벳으로 연락처 리스트를 그룹화해서 표시할 수 있다.

 

 

연락처 앱 / 설정 앱

 

 

 

---

 

TableView Cell

 

: 테이블 뷰를 이루는 행으로, UITableViewCell 클래스를 상속받는다. UITableViewCell 클래스에 정의된 표준 스타일을 활용하거나, 사용자가 커스텀하여 셀을 나타낼 수 있다. 기본적으로 셀은 콘텐츠 영역 와 액세서리 뷰 영역으로 나뉜다.

• 콘텐츠: 셀의 왼쪽 부분 ➿ 주로 문자열, 이미지 혹은 고유 식별자 등 입력
  
  
• 액세서리 뷰: 셀의 오른쪽 부분 ➿ 상세보기, 재정렬, 스위치 등과 같은 컨트롤 객체 위치

 

UITableView를 사용하기 위해서, UITableViewDataSource, UITableViewDelegate를 채택해서 구현해야 한다.

tableview는 datasource와 delegate 정의에 따라 tableview를 사용자에게 어떻게 표시할지 정한다.

 

• DataSource는 데이터를 받아 view를 그린다.
  
  
  • 총섹션의 개수, 행의 개수, 행에 어떤 정보를 정의
• Delegate는 tableView의 동작과 외관을 담당한다.
  
  
  • 행의 높이, 어떤 액션을 할 것인지 정의
    
    
  • delegate는 view가 변화하는 상황 담당, view는 delegate에 의존해 업데이트

 

 

TableViewDataSource

 

• TableViewDataSource 객체는 UITableViewDataSource 프로토콜을 채택
  
  
• DataSource는 TableView 생성/수정에 필요한 정보를 TableView 객체에 제공
  
  
• DataSource는 데이터 모델의 Delegate로, TableView의 시각적 모양에 대한 최소한의 정보 제공
  
  
• MVC(Model-View-Controller) 디자인 패턴 중, Model과 관련이 있다.
  
  
• UITableView 객체에 섹션의 수와 행의 수를 알려주며, 행의 삽입/삭제/재정렬 기능을 선택적으로 구현
  
  
• @required 선언된 두 가지 메서드는 UITableViewDataSource 프로토콜을 채택한 타입에 필수로 구현.
  
  

public protocol UITableViewDataSource: NSObjectProtocol{
	//각 섹션에 표시할 행의 개수를 묻는 메서드 -> 필수 구현
	func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
	
	//특정 인덱스 Row의 Cell에 대한 정보를 넣어 Cell을 반환하는 메서드 -> 필수 구현
	func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell

	//총 섹션 개수를 묻는 메서드
	optional func numberOfSections(in tableView: UITableView) -> Int

	//특정 섹션의 헤더 타이틀을 묻는 메서드
	optional func tableView(_ tableView: UITableView, titleForHearderSection section: Int) -> String?

	//특정 섹션의 풋터 타이틀을 묻는 메서드
	optional func tableView(_ tableView: UITableView, titleForFooterSection section: Int) -> String?

	//특정 위치의 행이 편집 가능한지 묻는 메서드
	optional func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool
	
	//특정 위치의 행을 재정렬할 수 있는지 묻는 메서드
	optional func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool
	
	//테이블 뷰 섹션 인덱스 타이틀을 묻는 메서드
	optional func sectionIndexTitles(for tableView: UITableView) -> [String]?

	//인덱스에 해당하는 섹션을 알려주는 메서드
	optional func tableView(_ tableView: UITableView, sectionForSectionIndexTitle title: String, at index: Int) -> Int

	//스와이프 모드, 편집 모드에서 버튼을 선택하면 호출되는 메서드
	//해당 메서드에서는 행에 변경사항을 Commit 해야한다.
	optional func tableView(_ tableView: UITableView, commmit editingStyle: UITableViewCell.EditingStyle, forRowAt indexPath: IndexPath)

	//행이 다른 위치로 이동되면 어디에서 어디로 이동했는지 알려주는 메서드
	optional func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath)

 

 

 

TableViewDelegate

 

• TableViewDelegate 객체는 UITableViewDelegate 프로토콜 채택
  
  
• TableViewDelegate는 테이블 뷰의모양과 동작을 관리
  
  
• MVC(Mode-View-Controller) 디자인 패턴 중, Controller와 관련이 있다.
  
  
• Delegate는 테이블 뷰의시각적인 부분 수정, 행의 선택(액션) 관리, 액세서리 뷰 지원 그리고 테이블 뷰의 개별 행 편집
  
  
• 필수 구현 메서드 없음

public protocol UITableViewDelegate: UIScrollViewDelegate{
	//행 선택되었을 때 호출되는 메서드
	optional func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath)
	
	//행 선택 해제되었을 때, 호출되는 메서드
	optional func tableView(_ tableView: UITableView, didDeSelectRowAt indexPath: IndexPath)

	//특정 위치 행의 높이를 묻는 메서드
	optional func numberOfSections(_ tableView: UITableView, heighForRowAt indexPath: IndexPath) -> CGFlaot

	//지정된 섹션의 헤더뷰 또는 푸터뷰에 표시할 View가 어떤 것인지 묻는 메서드
	optional func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?
	optional func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView?

	//지정된 섹션의 헤더뷰 또는 푸터뷰의 높이를 묻는 메서드
	optional func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat
	optional func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat

	//테이블 뷰가 편집 모드에 들어갔을 때 호출되는 메서드
	optional func tableView(_ tableView: UITableView, willBeginEditingRowAt indexPath: IndexPath)
	
	//테이블 뷰가 편집 모드에서 빠져나왔을 때 호출되는 메서드
	optional func tableView(_ tableView: UITableView, didEndEdtingRowAt indexPath: IndexPath?)
	
	//테이블 뷰가 셀을 사용하여 행을 그리기 직전에 호출되는 메서드
	optional func sectionIndexTitles(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath)

	//테이블 뷰로부터 셀이 화면에 사라지면 호출되는 메서드
	optional func tableView(_ tableView: UITableView, didEndDisplaying cell: UITableVeiwCell, forRowAt indexPath: IndexPath)

 

 

 

 

 

 

💡공부 및 기록용 블로그이므로 오류가 있을 수 있습니다.💡

만약 문제에 오류나 오타가 있다면 댓글로 알려주세요➿
언제나 환영합니다. 감사합니다. 화이팅!