[iOS / Swift] UITableView 만들기

ryu_y·2022년 7월 18일
1

UITableView 만들기

UITableView 생성

먼저 storyboard에 UITableView를 생성해줍니다.

또한 Cocoa Touch Class파일을 UITableViewController로 생성해줍니다.

그리고 storyboard에서 연결해줍니다.

생성후에는 많은 주석들이 존재하는 것을 볼수있습니다. 일단 viewDidLoad()를 제외하고 모두 지워줍니다.

TableView를 구성하는 가장 중요한 두 함수입니다.

numberOfRowsInSection

return값이 Int입니다.
numberOfRowsInSection 함수는 return 값으로 섹션안의 rows, 즉 셀의 개수를 정해주는 함수입니다.
예를 들어 5개의 셀을 가지도록 만들고 싶다면 return 5를 하면 됩니다.

override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 5
}

cellForRowAt

return값이 UITableViewCell입니다.
이 함수의 경우 셀안에 무엇을 넣어줄지 정해주는 함수입니다.
셀을 정의하고 그 셀을 커스텀하여 TableView에 출력하도록 하는 함수라고 볼수있습니다.
간단한 예로 배열을 셀에 출력해보겠습니다.
["1", "2", "3", "4", "5"]를 셀에 출력해보겠습니다.

먼저 셀을 만들어줍니다.
Cocoa Touch Class 파일을 TableViewCell로 만들어주고 storyboard의 셀과 연결해줍니다.

만들어준 셀을 불러오기 위해서는 Identifier를 지정하고 가져와야합니다.
storyboard의 TableView에서 TableViewCell을 클릭하고 인스펙터 영역에서 Identifier를 정해줍니다.

storyboard의 셀에서 Label을 만들어줍니다.

storyboard의 셀안에 Label과 아울렛 연결합니다.
연결후에 코드를 통해 Label에 배열값을 순서대로 넣어줄겠습니다.

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "TableViewCell", for: indexPath) as! TableViewCell
        
        cell.label.text = array[indexPath.row]
        return cell
    }

indexPath.row는 총 5개입니다. 0,1,2,3,4의 값이 차례로 들어가면서 cell.label.textarray[0], array[1],,,,array[4],를 넣어주게 되며
결과적으로 아래와 같이 셀이 채워지게됩니다.

기본적인 원리를 이해하면 Label 이외에도 다양한 값들을 손쉽게 넣어줄수 있습니다.

numberOfSections

return값을 Int로 받는 이 함수는 section의 개수를 정해주는 함수입니다.
셀의 한 묶음을 Section이라고 볼수있는데 그 묶음의 개수를 정해주는 함수입니다.
TableView 설정에서 Style을 Inset Grouped로 설정해주고 코드를 입력하면

    override func numberOfSections(in tableView: UITableView) -> Int {
        return 2
}

2개의 묶음으로 했을때

위와 같이 출력됩니다.

기타

didSelectRowAt : 셀을 선택할때 함수안의 코드를 실행합니다.
heightForRowAt : 셀의 높이를 지정합니다.
기초적인 TableView를 만들때 사용하는 함수들을 알아보았습니다.
이외에도 여러가지 함수들을 이용하여 TableView를 자유롭게 만들수있습니다.

profile
iOS 공부 기록

0개의 댓글