How to show "pull-to-refresh" element at the bottom of the UITableView in Swift

Question

I need to show UIRefreshControl at the bottom of the UITableView like in the following Objective-C libraries:

• https://github.com/emenegro/bottom-pull-to-refresh
• https://github.com/vlasov/CCBottomRefreshControl

but I'm using Swift and noticed some problems when using "Bridging-Header.h" file with these libraries.

What is the alternative and the easiest way to achieve such behavior?

Thanks in advance.

Answer 1

I got into the same problem in my project, and found this answer. You can add a UIActivityIndicatorView instance on the bottom of the table, initially hidden, and when it enters the if condition above, unhide it and start its animation.

You may need to change the table's bottom offset, add "1 cell" height to it while it's loading and place it back when it finishes inside the if condition as well.

In Swift 3:

func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {

    // Use this 'canLoadFromBottom' variable only if you want to load from bottom iff content > table size
    let contentSize = scrollView.contentSize.height
    let tableSize = scrollView.frame.size.height - scrollView.contentInset.top - scrollView.contentInset.bottom
    let canLoadFromBottom = contentSize > tableSize

    // Offset
    let currentOffset = scrollView.contentOffset.y
    let maximumOffset = scrollView.contentSize.height - scrollView.frame.size.height
    let difference = maximumOffset - currentOffset

    // Difference threshold as you like. -120.0 means pulling the cell up 120 points
    if canLoadFromBottom, difference <= -120.0 {

        // Save the current bottom inset
        let previousScrollViewBottomInset = scrollView.contentInset.bottom
        // Add 50 points to bottom inset, avoiding it from laying over the refresh control.
        scrollView.contentInset.bottom = previousScrollViewBottomInset + 50

        // loadMoreData function call
        loadMoreDataFunction(){ result in
            // Reset the bottom inset to its original value
            scrollView.contentInset.bottom = previousScrollViewBottomInset
        }
    }
}

Answer 2

var refreshControl: UIRefreshControl!

//Pull to refresh
self.refreshControl = UIRefreshControl()
self.refreshControl.attributedTitle = NSAttributedString(string: "Pull to refresh")
self.refreshControl.addTarget(self, action: "pullToRefresh:", forControlEvents: UIControlEvents.ValueChanged)
self.messageTableView.addSubview(refreshControl)

//Refresh the table view (pull to refresh)
func pullToRefresh(sender:AnyObject)
{
    print("pull to refresh...")
}