TableView 사용법

테이블뷰는 뷰 컨트롤러를 바탕으로 만들어진 특수한 컨트롤러 / 화면전체가 목록으로 이루어진 인터페이스 구현시 사용

정적: 테이블뷰 셀 각각을 프로그래밍적으로 구성하지 않고,

스토리보드에서 직접구성한것 ex) 옵션, 고정된화면에 사용 - Static Cells

 

 

테이블뷰컨트롤러

  테이블뷰

    테이블뷰 셀

        콘텐츠뷰

 

 

스토리보드에서 일반 VIewController에 TableVIew Controller 끌어다가 놓기 

- 테이블 뷰컨트롤러 놓고, 테이블뷰셀 라이브러리에서 갖다 넣기

ListViewcontroller.swift 파일 작성 후 - UI화면과 클래스를 연결한다.

 

TableView안의 셀 선택 하고 - 스타일 설정

identifier의 값을 "ListCell"'로 작성 -  ( ListViewcontroller.swift 에서 구분자로 사용 )

 

MovieVo.swift 클래스 생성 / 영화정보를 담기위한 객체

( Value Object패턴, 데이터 저장을 하는 클래스 분리하는 설계방식 )

// 영화정보를 담기위한 객체
// 각각의 프로퍼티는 비어있을수도 있으므로 옵셔널타입으로 선언한다.
import Foundation

class MovieVo {
    var thumbnail: String? // 영화섬네일 이미지주소
    var title: String? // 영화제목
    var description: String? // 영화설명
    var detail: String? // 상세정보
    var opendate: String? // 개봉일
    var rating: Double? // 평점
}

 

ListViewcontroller.swift 

import UIKit

class ListViewcontroller: UITableViewController {
    
    // 튜플 아이템으로 구성된 데이터 세트
    var dataset = [
        ("다크나이트", "다크나이트설명","2020-010-15",8.95),
        ("호우시절", "때를 알고 내리는 좋은비","2020-010-15",7.53),
        ("말할수없는비밀", "말할수없는 비밀설명", "2015-09-08", 9.93)
    ]
    
    //테이블뷰를 구성할 리스트데이터
    lazy var list: [MovieVo] = {
        var datalist = [MovieVo]()
        for (title, desc, opendate, rating) in self.dataset {
            
            let mvo = MovieVo()
            mvo.title = title
            mvo.description = desc
            mvo.opendate = opendate
            mvo.rating = rating
            
            datalist.append(mvo)
        }
        return datalist
    }()
    
    override func viewDidLoad() {
        
    }
    
    
    // 테이블뷰의 행의 개수를 반환하는 메소드
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.list.count
    }
    
    // 테이블뷰의 행을 구성하는 메소드
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        // 주어진 행에 맞는 데이터 소스를 읽어온다.
        let row = self.list[indexPath.row]
        
        print(" 로그 : \(row )")
        
        // 테이블 셀 객체를 직접생성하는 대신 큐로부터 가져옴self.cellIdentifier, for: indexPath
        let cell = tableView.dequeueReusableCell(withIdentifier: "ListCell")!
        // 타이틀
        cell.textLabel?.text = row.title
        
        //서브타이틀에 데이터 연결
        cell.detailTextLabel?.text  = row.description
        
        return cell
    }
    
    // 테이블 셀을 클릭하거나 터치했을때의 액션처리
    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        NSLog("선택된 행은 \(indexPath.row)번째 행입니다.")
    }
    
}

목록 하단 부분에 빈부분을 채워주기위해 스토리보드에서 하단에 View를 끌어다가 넣어준다.

---

lazy 키워드를 붙어서 변수를 정의 하면 참조되는 시점에 맞추어 초기화되므로, 메모리 낭비를 줄일 수 있다.

테이블 뷰에 데이터 소스 연동을 위해 필요한 메소드 

 

메인스토리보드에서 TableView를 끌어서 뷰컨트롤러에 연결 / delegate, datasource연결을 해준다.

    // 테이블뷰의 행의 개수를 반환하는 메소드
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.list.count
    }
    
    // 테이블뷰의 행을 구성하는 메소드
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        // 주어진 행에 맞는 데이터 소스를 읽어온다.
        let row = self.list[indexPath.row]

        // 테이블 셀 객체를 직접생성하는 대신 큐로부터 가져옴self.cellIdentifier, for: indexPath
        let cell = tableView.dequeueReusableCell(withIdentifier: "ListCell")!
        
        // 타이틀
        cell.textLabel?.text = row.title
        
        //서브타이틀에 데이터 연결
        cell.detailTextLabel?.text  = row.description
        
        return cell
    }

사용자 액션 처리를 위한 메소드 - 화면이동, 상세내용을 팝업으로 보여주는 다양한 기능 구현시 여기에서 처리

    
    // 테이블 셀을 클릭하거나 터치했을때의 액션처리
    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        NSLog("선택된 행은 \(indexPath.row)번째 행입니다.")
    }