【Swift】TableViewのスワイプで画面を更新する(Pull to Refresh)

目次

• Pull to Refreshとはなにか
• よりiOS的なPull to Refreshとはなにか
  • デフォルトのUIScrollViewオブジェクト一覧
• UIRefreshControlとはなにか
• 実装方法
  • 1. UIScrollViewクラスにUIRefreshControlクラスを生成して、イベントを紐付ける
  • 2. 呼び出される関数を記述する

Pull to Refreshとはなにか

画面を下に引っ張ると、画面の要素(主にリストビュー)が更新せれる仕組みのことを言います。

よりiOS的なPull to Refreshとはなにか

UIRefreshControlを、UIScrollViewを実装しているクラスに追加することでPull to Refreshの機能を追加することができます。

デフォルトのUIScrollViewオブジェクト一覧

アプリケーションのウィンドウサイズよりもコンテンツが大きい場合のサポートを提供するクラス

• UITableView
• UITextView
  など

UIRefreshControlとはなにか

• https://developer.apple.com/documentation/uikit/uirefreshcontrol

UIScrollViewオブジェクトにアタッチできる標準的なコントロールです。

実装方法

1. UIScrollViewクラスにUIRefreshControlクラスを生成して、イベントを紐付ける

ViewControllerのviewDidLoadメソッド内でrefreshControlの設定を行います

@IBOutlet weak var tableView: UITableView! // StoryBoardから紐付け

override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        //RefreshControlを追加する処理
        tableView.refreshControl = UIRefreshControl()
        tableView.refreshControl?.addTarget(self, action: #selector(呼び出される関数), for: .valueChanged)

• refreshControl : UIScrollViewクラスにある変数でUIRefreshControlクラスのインスタンスを設定する
• addTarget : UIRefreshControlクラスの実装している->UIControlクラスにあるメソッドで指定したイベントのアクションを設定する

  open func addTarget(_ target: Any?, action: Selector, for controlEvents: UIControl.Event)

  特定のイベントに対するターゲット／アクションを追加する。これは複数回呼び出すことができ、特定のイベントに対して複数のターゲット／アクションを指定することができます。
  ターゲットに nil を渡すと、レスポンダーチェーンをさかのぼります。アクションには、オプションで送信者とイベントの順に含めることができます。
  アクションに NULL を指定することはできません。ターゲットは保持されないことに注意してください。

  • Selector : https://qiita.com/st43/items/43c5c0f5e1f727ba0ff0

2. 呼び出される関数を記述する

addTargetに設定した呼び出される関数を作成し、そこに処理を記述します

処理の最後に、endRefreshingを呼ぶ必要があります。

@objc func handleRefreshControl() {
       // 更新したい処理をここに記述

       //上記の処理が終了したら下記が実行されます。
       DispatchQueue.main.async {
          self.tableView.reloadData()  //TableViewの中身を更新する場合はここでリロード処理
          self.tableView.refreshControl?.endRefreshing()  //これを必ず記載すること
       }
    }