ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [ios - Swift] UITableView 무한스크롤 구현하기
    ios 2020. 11. 22. 17:13

     

     

     

    Tableview를 이용하다 보면 row의 수가 적을 경우 문제 되지 않지만 row의 수가 많다 보면 데이터를 불러올 때 부담이 될 수 있습니다.

     

    그렇기 때문에 우리는 사용자가 원할 때 추가로 다음 데이터를 불러오는 작업을 무한 스크롤을 이용해서 처리해 보도록 하겠습니다.

     

     

    1. Data 준비하기

    func HttpData() {
        print("HTTP 호출 시작 \(cnt)")
        cnt = cnt + 1
    
        let newsAddress : String = "http://newsapi.org/v2/top-headlines?country=kr&apiKey=75c9a397ffa14b8694f458a03c5342cf"
    
        let task = URLSession.shared.dataTask(with: URL(string: newsAddress)!) { (data, response, error) in
    
            if let pData = data {
                do {
                    let json = try JSONSerialization.jsonObject(with: pData, options:[]) as! Dictionary<String, Any>
    
                    if let article = json["articles"] as? Array<Dictionary<String, Any>> {
                        for (idx, value) in article.enumerated() {
                            if let str = value["title"] {
                                self.mList.append("\(str)")
                            }
                        }
                    }
    
                    DispatchQueue.main.async {
                        self.mTableView.reloadData()
                    }
                    
                    self.isIgnore = false
                } catch {
                }
            }
        }
        task.resume()
    }

     

    구글에  Nesw API 검색하면 무료로 제공해 주는 데이터를 이용하여 TableView에 표시하도록 합니다.

     

     

     

     

    2. willDisplay

    willDisplay는 테이블 뷰가 특정 행에 대한 셀을 그리려고 한다는 것을 대리인에 알린다고 정의되어있습니다.

     

    이것을 이용하여 데이터 로드를 처리해 보도록 하겠습니다.

     

    func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
        if !isIgnore {
            print("디스플레이")
            isIgnore = true
            HttpData()
        }
    }
    

     

    위 소스를 보면 테이블 뷰의 로우의 끝에서 5번째 로우 내 도달했을 때 새 데이터를 불러올 수 있도록 처리하였습니다.

     

    isIgnore 변수를 이용하여 데이터를 여러번 가져오는것을 방지합니다.

     

     

     

    댓글

Designed by Tistory.