10.4. Progress and Activity Indicators

Activity indicators notify the user that an operation is in progress. Progress indicators do the same, and give the user a general idea of how far along the process is toward completion. The SDK supports two types of indicators:



UIActivityIndicatorView

This class presents a spinning clock-like animation—the kind seen when turning on the iPhone's WiFi or Bluetooth support, or when your Mac desktop boots up.



UIProgressView

This class provides a thermometer-like readout, allowing the application to express how far along an operation is until completion.

Both types of indicators derive from the UIView base class; meaning you can layer them on top of text views, alert sheets, table cells, and any other object that derives from UIView.

10.4.1. UIActivityIndicatorView: Things That Spin

The UIActivityIndicatorView class is a simple animation class small enough to attach to nearly any UIView object, including table cells and action sheets. The indicator displays a clock-like animation of tick marks making revolutions around a circle.

You create the indicator with a frame identifying the indicator's size and the coordinates relative to the view to which it is attached:

 

UIActivityIndicatorView *activityIndicator = [ [ UIActivityIndicatorView alloc ]
    initWithFrame: CGRectMake(260.0, 12.0, 25.0, 25.0)
];

                                          

The indicator supports three styles, which you can assign by setting the indicator's activityIndicatorViewStyle property:

activityIndicator.activityIndicatorViewStyle = UIActivityIndicatorViewStyleGray;

                                          

You may use the following styles.

Style Description
UIActivityIndicatorViewStyleWhiteLarge Large white indicator
UIActivityIndicatorViewStyleWhite Standard-sized white indicator
UIActivityIndicatorViewStyleGray Gray indicator, for white backgrounds

To automatically hide the view when the indicator is stopped, use the hidesWhenStop⁠ped property. The default is to hide the indicator, so set this property to NO if you want to display the indicator when it's frozen:

activityIndicator.hidesWhenStopped = NO;

You can add the progress indicator object to any existing view object, such as a table cell or view:

[ tableCell addSubview: activityIndicator ];

Finally, to start and stop the animation, use the startAnimating and stopAnimating methods:

[ activityIndicator startAnimating ];

[ activityIndicator stopAnimating ];

10.4.2. UIProgressView: When Spinny Things Are Tacky

The UIProgressView object is a close cousin to UIActivityIndicatorView. Instead of displaying a drool-inciting animation, the progress view class draws a thermometer-like indicator and provides an interface to set its fill level as your application crunches on its operation. The advantage of using a progress bar is that it can reflect more or less accurately how much work the application has actually done.

To create a progress view, the class's initialization method includes a frame identifying the bar's size and display origin:

UIProgressView *progressView = [ [ UIProgressView alloc ]
    initWithFrame: CGRectMake(175.0, 20.0, 125.0, 25.0)
];

The indicator supports two different styles, which you can assign by setting the progress view's progressViewStyle property:

progressView.progressViewStyle = UIProgressViewStyleBar;

You may use the following styles.

Style Description
UIProgressViewStyleDefault Standard progress bar
UIProgressViewStyleBar Dark gray bar, for use in toolbars

To display the progress view, add it to an existing UIView object. You can add progress views to table cells, toolbars, and other view classes:

[ myToolbar addSubview: progressView ];

When the progress bar is displayed, the application can update its progress to indicate how far along it is in its operation. The progress value is a floating-point value between 0.0 and 1.0:

progressView.progress = 0.5;

10.4.3. Network Activity Indicators

When your application is using the network, it should alert the user by placing a network indicator on the iPhone's status bar. To do this, use a UIApplication property named networkActivityIndicatorVisible. Set this Boolean value to enable or disable the network indicator:

UIApplication *myApp = [ UIApplication sharedApplication ];
myApp.networkActivityIndicatorVisible = YES;

10.4.4. Further Study

  • Use your knowledge of navigation controllers from Chapter 3 to create a UIProgressView object in the toolbar. Use an NSTimer object or a separate thread to fill the bar. When it has reached its full capacity, drain the progress view back to zero. This is an ideal use when your application needs to check online for updates or product announcements.

  • Check out UIProgressView.h and UIActivityIndicatorView.h prototypes. You'll find these deep within /Developer/Platforms/iPhoneOS.platform, inside the UI Kit framework's Headers directory.