1.25. Displaying Progress with UIProgressView

Problem

You want to display a progress bar on the screen, depicting the progress of a certain task; for instance, the progress of downloading a file from a URL.

Solution

Instantiate a view of type UIProgressView and place it on another view.

Discussion

A progress view is what programmers generally call a progress bar. An example of a progress view is depicted in Figure 1-68.

A simple progress view

Figure 1-68. A simple progress view

Progress views are generally displayed to users to show them the progress of a task that has a well-defined starting and ending point. For instance, downloading 30 files is a well-defined task with a specific starting and ending point. This task obviously finishes when all 30 files have been downloaded. A progress view is an instance of UIProgressView and is initialized using the designated initializer of this class, the initWithProgressViewStyle: method. This method takes in the style of the progress bar to be created as a parameter. This parameter is of type UIProgressViewStyle and can therefore be one of the following values:

UIProgressViewStyleDefault

This is the default style of the progress view. An example of this is the progress view shown in Figure 1-68.

UIProgressViewStyleBar

This is similar to the UIProgressViewStyleDefault but is meant to be used for progress views that are to be added to a toolbar.

An instance of UIProgressView defines a property called progress (of type float). This property tells iOS how the bar inside the progress view should be rendered. This value must be in the range +0 to +1.0. If the value of +0 is given, the progress bar won’t appear to have started yet. A value of +1.0 shows progress of 100%. The progress depicted in Figure 1-68 is 0.5 (or 50%).

To get used to creating progress views, let’s create one similar to what we saw in Figure 1-68. First things first: define a property for your progress view:

#import "ViewController.h"

@interface ViewController ()
@property (nonatomic, strong) UIProgressView *progressView;
@end

@implementation ViewController

Then instantiate an object of type UIProgressView:

- (void)viewDidLoad{

    [super viewDidLoad];

    self.progressView = [[UIProgressView alloc]
                         initWithProgressViewStyle:UIProgressViewStyleBar];
    self.progressView.center = self.view.center;
    self.progressView.progress = 20.0f / 30.0f;
    [self.view addSubview:self.progressView];

}

Obviously, creating a progress view is very straightforward. All you really need to do is display your progress correctly, because the progress property of a progress view should be in the range +0 to +1.0, which is a normalized value. So if you have 30 tasks to take care of and you have completed 20 of them so far, you need to assign the result of the following equation to the progress property of your progress view:

self.progressView.progress = 20.0f / 30.0f;

Warning

The reason the values 20 and 30 are passed to the equation as floating-point values is to tell the compiler that the division has to happen on floating-point values, producing a value with decimal numbers. If you provided the integer division 20/30 to the compiler to place inside the progress property of your progress view, you would get the integral value of 0 out of the division, because the compiler will perform integer division that truncates the result to the next lower integer. In short, your progress view would show zero progress all the way to the end, when 30/30 produces the result of 1; not of much value to the user.

Get iOS 7 Programming Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.