Adding Progress Indicator

Now app looks better, all functions work as expected, but it still has one problem - each time user opens MoodSelectorScreen we start getting user's location and a forecast, but a user is not aware of any processes that are going under the hood. Sometimes it even results in an Error message when the user wants to create new Mood object, but the forecast is not yet ready.

In this chapter, we will use a loading indicator to show the user that app is busy fetching location and forecast. Apple already has some elements that can be used (for example UIProgressView or UIActivityIndicatorView) and they would fit way better in this case, but we need to practice in using Cocoapods for now.

So let's head to cocoapods website and look for some progress indicators.

Seems like the most popular library for today is a SVProgressHUD, so we will try to use it. Let's add it to the Rakefile:

        app.pods do
            pod 'TEAChart', git: 'https://github.com/savytskyi/TEAChart'
            pod 'SVProgressHUD'
          end
        
And let's run rake pod:install.

Now we need to check SVProgressHUD docs. It seems like to show it with some status we need to call SVProgressHUD.showWithStatus(status), and SVProgressHUD.dismiss to hide it.

Our goal is to show a loading indicator when the app starts getting user's location or forecast and hide it when everything is ready. To keep well informed of what is going on in the app we will show two indicators: one when we get a location for him, and one when we wait for a forecast.

        # showing location indicator:
        def get_location
          SVProgressHUD.showWithStatus "Getting location"
          @location_manager ||= CLLocationManager.alloc.init

          # rest of the method ...
        end

        # hiding location indicator:
        def locationManager(manager, didUpdateLocations: locations)
          SVProgressHUD.dismiss

          # rest of the method ...
        end

        # showing and hiding forecast indicator:
        def update_forecast
          return if !@location.is_a?(Hash)

          SVProgressHUD.showWithStatus "Getting forecast"
          Forecast.for_location(@location, on_date: NSDate.now) do |forecast, error|
            SVProgressHUD.dismiss

            # rest of the method
          end
        end
        
When you run the app you will see something like this:

SVProgressHUD is very customizable. For example, if you don't want user to interact with the app when something important is loading you can change loading indicator mask from a default one to a gradient:

        SVProgressHUD.showWithStatus "Getting forecast", maskType: SVProgressHUDMaskTypeGradient
      

I think I don't need to remind already:

        git add .
        git commit -m "added progress indicator"
      

Summary

In this chapter, we added a progress indicator that helps users ti understand that app is currently busy with some task. Cocoapods were used to add a third party progress indicator library.

To read more about SVProgressHUD features, please visit its Github page.

Book Index | Next