現在開発中のアプリでTwitterのタイムラインのような、Viewを下スワイプして中身を更新する処理を追加したいと思い調査して実装。
ヒットした記事でなかなか実装出来ず多少詰まったため、記事を書くことにしました。
この記事は筆者の半ば備忘録的な記事です。
UIRefreshControlとは
画面を下に引っ張ってデータを更新するUI部品。
TwitterやYouTubeなどで皆さんが一度は見たことがある、あのクルクルです。
以下、Appleが提供するドキュメントから一部抜粋。
UIRefreshControlはUITableViewやCollectionViewを含むUIScrollViewに接続できる標準的なコントロールです。
英語でじっくり読みたいって方は一番下のリンクから飛んでみてください。
要は、スクロールビューならどれでも使えるよというやつです。
実行環境
Xcode 12.4
Swift 5.3.2
実装方法
そんな難しくはなく、すぐ実装出来ます。
@IBOutlet weak var tableView: UITableView! //storyboardのTableViewをアウトレット接続
override func viewDidLoad() {
super.viewDidLoad()
tableView.dataSource = self //TableViewを使うなら必須の処理
tableView.delegate = self //TableViewを使うなら必須の処理
configureRefreshControl() //この関数を実行することで更新処理がスタート
}
//〜中略〜
func configureRefreshControl () {
//RefreshControlを追加する処理
tableView.refreshControl = UIRefreshControl()
tableView.refreshControl?.addTarget(self, action: #selector(handleRefreshControl), for: .valueChanged)
}
@objc func handleRefreshControl() {
/*
更新したい処理をここに記入(データの受け取りなど)
*/
//上記の処理が終了したら下記が実行されます。
DispatchQueue.main.async {
self.tableView.reloadData() //TableViewの中身を更新する場合はここでリロード処理
self.tableView.refreshControl?.endRefreshing() //これを必ず記載すること
}
}
以上です。
コメントアウトで解説は書いているのでそちらを参考にしていただけたらと思います。
注意点としては.endRefreshing()を必ず書いてくださいということくらいです。
最後に
比較的簡単に実装出来る機能ですが、汎用性の高いUIなのかなと思います。
ぜひ、実装してみてより良いアプリ開発ライフを送っていきましょう。
ではまた。