iOS UIKit 튜토리얼 - UITableView - 3 // Section

이번에 포스트에서 진행할 튜토리얼은 UITableView의 Section기능이다. UITableView에는 여러종류의 데이터를 나워서 표현할 수 있는 Section이라는 기능을 제공한다. 흔히 연락처 앱에서 가,나,다 혹은 ABC 순으로 Section을 나워서 보여주는 것을 볼 수 있다.

1. Section 정의하기

section타이틀을 정의한다. 이번 포스트에서는 2개의 타이틀을 정의 하였다.

    let sections = ["mydata", "mydata2"]

 

2. 데이터 정의하기

섹션을 2개 정의 하였으므로 데이터도 두개의 데이터를 정의해준다.

   let myData = [
        NameEmail(name: "James",email: "James@gmail.com"),
        NameEmail(name: "LaLa",email: "LaLa@gmail.com"),
        NameEmail(name: "Kim",email: "Kim@gmail.com"),
        NameEmail(name: "Hong",email: "Hong@gmail.com")
    ]
    let myData2 = [
        NameEmail(name: "김철수",email: "kim@gmail.com"),
        NameEmail(name: "안철수",email: "ahn@gmail.com"),
        NameEmail(name: "고길동",email: "gogo@gmail.com"),
        NameEmail(name: "백종원",email: "backback@gmail.com")
    ]

 

3.  func numberOfSections(in tableView: UITableView) -> Int구현 

numberOfSections는 section의 갯수를 리턴해줘야 한다.

   func numberOfSections(in tableView: UITableView) -> Int {
        return sections.count
    }

앞서 정의한 section의 갯수를 리턴해준다.

 

4. func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? 구현

func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? 에서는 Section의 Header를 리턴한다.

titleForHeaderInSection로는 구하고자 하는 section의 index가 전달된다. 0이면 첫번째 section의 header를 리턴해달라는 것.

  func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
        return sections[section]
        
    }

 

5. func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) 

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int)에서는 각 section별 데이터갯수를 리턴해줘야 한다. numberOfRowsInSection으로는  section의 index가 들어온다. 0이면 첫번째 section의 데이터갯수를 리턴해 달라는 것.

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        if(section == 0)
        {
            return myData.count
        }
        return myData2.count
    }

 

6. func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell 

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell 에서는 실제 data가 들어있는 UITablewViewCell을 리턴한다. 

indexPath.section은 section의 index를 나타내며 indexPath.row는 해당 section의 row index를 나타낸다.

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell: MyTableViewCell = self.myTableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath) as! MyTableViewCell
        if( indexPath.section == 0 )
        {
            cell.emailLabel.text = myData[indexPath.row].email
            cell.nameLabel.text = myData[indexPath.row].name
        }else{
            cell.emailLabel.text = myData2[indexPath.row].email
            cell.nameLabel.text = myData2[indexPath.row].name

        }
      
        return cell
    }

 

7. 실행

전체 소스는 github에서 확인 할 수 있다.

github.com/lucidmaj7/ios_study/releases/tag/UITableView3_Section

Release UITableView3_Section · lucidmaj7/ios_study