Make refresh Indicator like Skype in iOS

We are going to make a refresh indicator like Skype

In Skype there is a bar to show when it is connected or disconnected with the network. We are to make same bar for showing updating data on refreshing the table.

So for making this refresh Indicator we have to follow these steps:

First we have to make a UIView and attach it to the top of tableview

    func updatingSubviews() {
        updateView.frame = CGRect(x: 0, y: 64, width: self.view.frame.width, height: 10)
        updateView.backgroundColor = ColorCode().greenColor
               self.view.addSubview(updateView)
        updateView.hidden = true
    }

Now we will add a text to this view to show its updating

     let label: UILabel = UILabel()
     label.frame.size = updateView.bounds.size
     label.text = "Updating..."
     label.textAlignment = .Center
     label.font = UIFont.systemFontOfSize(8)
     label.textColor = UIColor.whiteColor()
     updateView.addSubview(label)
     

add these lines in the updatingSubviews(). Call this fund in viewDidLoad(). The bar is been created, now we have to hide and unhide it accordingly.

Now we will UIRefreshControl to code. Put this on the top where variables are defined 

var refreshControl:UIRefreshControl!

Add this function in your code for displaying Refresh controller 

//----- Function for displaying Refresh Controller
    func refreshControllerUI(){
        self.refreshControl = UIRefreshControl()
        self.refreshControl.backgroundColor = UIColor.whiteColor()
        self.refreshControl.attributedTitle = NSAttributedString(string: "Pull to refresh")
        self.refreshControl.addTarget(self, action: #selector(ViewController.refresh(_:)), forControlEvents: UIControlEvents.ValueChanged)
        self.tableView.addSubview(refreshControl)
    }     

this func is defining the RefreshController and assigning an action refresh(_:) to be performed when refresh control is been refreshing.

Now this the action we need to add:

       //------ Method for Refresh
    func refresh(sender:AnyObject){
        if self.refreshControl.refreshing == true {
            self.refreshControl.attributedTitle = NSAttributedString(string: “Please wait”)
        }

        // Perform task which has to be performed
        self.tableView.reloadData()
    }
     

as table is been refreshed so we need to unhide the bar we created. So add this line to refresh(_:)

     updateView.hidden = false

Now the final task is to hide the bar when table is been updated or when task has been performed. Then we need to add this line just

     updateView.hidden = true
     

Now make the build and run the app. 

Oops we got the view visible from starting, we missed to hide it. So for this we have to put this line in updatingSubviews() and Enjoy the build.

    updateView.hidden = true
     

Thanks