TableViewをスクロールしてデータ更新（上・下それぞれバージョン）

7614 ワード
Swift UIRefreshControl tableView UITableView collectionView tableView テキストリンク

SNSなどで見かける、読み込み済みコンテンツの端までいったら、続きを読み込む方法です。

データ更新部分を準備

データ更新処理を待つためにセマフォを設定します。


let semaphore = DispatchSemaphore(value: 1)

リフレッシュ時に以下の関数を呼ぶこととします。
ここで通信リクエストなど行います。

func updateData () {
    DispatchQueue.global().async {

        //*** ここでデータを更新する処理をする ***

        DispatchQueue.main.async {
            self.tableView.reloadData()
            self.semaphore.signal() // 処理が終わった信号を送る
        }
    }
}

下向きスクロールで更新

下向きに引っ張ってリフレッシュする場合は、UIRefreshControlが使えます。

この記事：[Swift/iOS] フリックで更新するTableViewの方法です。

１、UIRefreshControlを設置します

var refreshControl:UIRefreshControl!

override func viewDidLoad() {
        super.viewDidLoad()
        refreshControl = UIRefreshControl()
        refreshControl.attributedTitle = NSAttributedString(string: "再読み込み中")
        refreshControl.addTarget(self, action: #selector(ViewController.refresh), for: UIControl.Event.valueChanged)
        tableView.addSubview(refreshControl)
}

２、リフレッシュ時に呼ばれる関数を設定します

    @objc func refresh() {
        updateData()

        semaphore.wait()
        semaphore.signal()
        // データ更新関数が終了したら、リフレッシュの表示も終了する
        refreshControl.endRefreshing()
    }

上向きスクロールで更新

TableViewの一番下までスクロールしたら続きを更新する方法。YoutubeなどのUIみたいな。
ScrollViewのデリゲートメソッドを使います。TableViewはScrollViewクラスを継承しているので。

func scrollViewDidScroll(_ scrollView: UIScrollView) {
   let height = scrollView.frame.size.height
   let contentYoffset = scrollView.contentOffset.y
   let distanceFromBottom = scrollView.contentSize.height - contentYoffset
   if distanceFromBottom < height {
       if self.reloading { // デリゲートは何回も呼ばれてしまうので、リロード中はfalseにしておく
           updateData()
           semaphore.wait()
           semaphore.signal()        
           self.reloading = false
       }
   }
}

🐣

お仕事のご相談こちらまで
[email protected]

Core MLを使ったアプリを作っています。
機械学習関連の情報を発信しています。

Twitter
Medium