iOS/UIKit

[UIKit] TableView Controller 에 대하여 (2/2)

하노 Hano 2022. 7. 18. 20:49

안녕하세요 하노입니다 :)

지난번에는 TableView Controller란 무엇이고, TableView Controller를 StoryBoard로 구현하는 방법에 대하여 알아보았는데요.

 

오늘은 TableView Controller를 코드로 설정 및 구현하는 방법에 대하여 알아보겠습니다.

 

 


우선 시작하기 전에 

 

https://glsman-111co.tistory.com/13

 

[UIKit] TableView Controller 에 대하여 (1/2)

안녕하세요 하노입니다:) 오늘은 TableView Controller에 대하여 알아보겠습니다. TableView Controller는 글을 쓰다 보면 너무 양이 방대 해질 것 같아 2부로 나누려고 합니다. 그럼 시작하겠습니다! 1. TableV

glsman-111co.tistory.com

 

위 글의 프로젝트 상태에서 시작하겠습니다!

 

 

1. TableView Cell의 디자인 및 데이터 설정

이 메서드는 한 셀에 대한 디자인 및 데이터를 설정하는 메서드입니다.

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
	let cell = tableView.dequeueReusableCell(withIdentifier: "myCell")!
    cell.textLabel?.text = "텍스트"
    cell.textLabel?.textColor = .magenta
    cell.textLabel?.font = .systemFont(ofSize: 20, weight: .bold)
    cell.backgroundColor = .systemYellow
    
    return cell
}

 

 

2. Table View Cell의 개수

override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    // #warning Incomplete implementation, return the number of rows
    return 2
}

 

위 메서드는 한 섹션에 속한 cell의 개수를 return 해주는 메서드입니다.

 

 

 

3. Table View Section 개수

섹션의 개수를 return해주는 메서드입니다.

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

 

 

 

4. Table View Header & Footer

Table View 내 한 섹션의 Header와 Footer를 String으로 return 해주는 함수입니다.

 

override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
    return "헤더"
}

 

override func tableView(_ tableView: UITableView, titleForFooterInSection section: Int) -> String? {
    return "푸터"
}

 

여기까지의 코드를 빌드하여 정상적으로 동작하는지 확인해보겠습니다.

빌드 결과 정상적으로 빌드되는 것을 확인해볼 수 있습니다.

 

 

여기서 만약 TableView Cell 내 Title을 각각 데이터를 받아서 변경하고 싶은 상황이 있을 수 있습니다.

저는 데이터가 저장된 배열을 Title에 넣어보겠습니다.

 

 

var myTitleArray = ["안녕하세요", "하노입니다."]
    
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "myCell")!
    cell.textLabel?.text = myTitleArray[indexPath.row]

    return cell
}

 

저는 "안녕하세요", "하노입니다." 를 담은 배열을 생성하였습니다.

그리고 배열의 멤버 접근을 indexPath.row로 접근하였습니다.

 

indexPath.row의 의미는 cell의 좌표라고 생각하시면 됩니다.

 

예를 들어, 첫번째 cell의 좌표는 0, 두 번째 cell의 좌표는 1 ... n번째 cell의 좌표는 n-1 로 생각하시면 편할 것 같습니다.

 

빌드하여 결과를 확인해보겠습니다.

 

 

 

 

정상적으로 동작하는군요!

 

이렇게 데이터를 받아서 cell안에 값을 넣을 수 있습니다.

 

 

 


 

오늘은 TableView Controller를 코드로 설정하고 구현하는 방법에 대하여 알아보았습니다.

 

사실 이 4가지 메서드 말고도 TableView 관련 메서드는 정말 많은데요. 궁금하신 분들은 우리의 문서!

애플 공식문서를 확인해주시면 되겠습니다.

 

저도 요새 TableView Controller를 사용할 일이 많아지다 보니깐 다시 공부하면서 잊어버린 내용을 정리하고 있는데요.

특히 메서드는 정말 많아서 저도 헷갈릴 정도입니다..ㅎㅎ

하지만 난이도는 그렇게 어렵지 않으니 공부하면서 사용해보시면 충분히 마스터할 수 있을 거라 생각합니다!

 

그럼 오늘 글은 여기서 마치도록 하겠습니다 :)