Fix iOS pull to refresh animation

Question

Here is my code for the Refresh Control. ( Code has been updated with the entire ViewController Code for better understanding )

import UIKit

class AirportTableViewController: UIViewController, UITableViewDataSource, UITableViewDelegate, AirportRequestDelegate {


    @IBOutlet weak var airportTable: UITableView!
    var airportRequest = AirportRequest()
    var airportList = [AirportDetail]()
    var refreshControl = UIRefreshControl()

    override func viewDidLoad() {
        super.viewDidLoad()
        self.title = "Airport List"
        airportTable.delegate = self
        airportRequest.delegate = self
        airportRequest.fetchAirports()
        airportTable.dataSource = self
        refreshControl.addTarget(self, action: #selector(refresh), for: UIControl.Event.valueChanged)
        airportTable.addSubview(refreshControl)

    }

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return airportList.count
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let myCell = airportTable.dequeueReusableCell(withIdentifier: "airportTableCell", for: indexPath)
        myCell.textLabel?.text = self.airportList[indexPath.row].AirportName
        myCell.detailTextLabel?.text = self.airportList[indexPath.row].StationName
        myCell.accessoryType = .disclosureIndicator
        return myCell
    }

    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        self.airportTable.deselectRow(at: indexPath, animated: true)
    }

    func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCell.EditingStyle, forRowAt indexPath: IndexPath) {
        if  editingStyle == .delete {
            self.airportList.remove(at: indexPath.row)
            airportTable.deleteRows(at: [indexPath], with: .top)
        }
    }


// The AirportRequestDelegate adds this function and is called once airport list is fetched
    func didUpdateAirports(_ airportRequest: AirportRequest, airports: [AirportDetail]) {

// copies the airport list to a local variable so that it can be used with the tableView delegate functions
        self.airportList = airports

// updating the UI
        DispatchQueue.main.async {
            self.airportTable.reloadData()
            self.refreshControl.endRefreshing()
        }
    }

    @objc func refresh(sender: UIRefreshControl) {
        airportRequest.fetchAirports()
    }


}

In the Image below you can see that the animation doesnt work as expected. how do i fix this. Preferably I would like the animation to continue until the tableView has been updated.

Answer 1

Adding refresh control as a subview could be a problem. UITableView now have property for the refresh control. Here you have description from apple documentation how you should implement that: https://developer.apple.com/documentation/uikit/uirefreshcontrol