Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I put a progress bar in a UINavigationController's toolbar like the Mail app?

My application connects to the network to retrieve some data and I'd like to show a progress bar in the toolbar of the UINavigationController of my application.

What I actually want is very similar to the Mail application:

                                      Screenshot of Mail application showing an example toolbar layout

Except I would like to have nothing to the left of the progress bar, and a cancel button on the right.

I've fiddled around with code, trying to do this, but I've never worked with the toolbar of a nav controller before, so I'm unsure of where to start.

Does anyone know I might go about doing this, or where I could find resources explaining how to do this?

I've read over the Human Interface Guide, the UINavigationController class reference, and the View Controller Programming Guide, but they only show how to do very basic toolbar layouts, with simple buttons and segmented controls.

like image 707
Ben S Avatar asked Nov 18 '09 19:11

Ben S


2 Answers

Start with an empty UIView, add a text label and a progress indicator and position them as they appear in the Mail app. Finally, create a UIBarButtonItem that contains this view and add it to your toolbar:

UIBarButtonItem* progressItem = [[UIBarButtonItem alloc] initWithCustomView:progressItemView];
toolbar.items = [NSArray arrayWithObject:progressItem];

You can do this programmatically or in Interface Builder.

like image 61
Darren Avatar answered Oct 21 '22 03:10

Darren


This is quite easy using IB. Just drag in a Toolbar to your view, then drag an NSProgressIndicator. Finally, drag an NSFlexibleSpacer in to the left of the progress bar, and your cancel button to the right. You may need to add a few NSSpacers to the left and right to get everything to line up properly.

like image 32
Ben Gottlieb Avatar answered Oct 21 '22 03:10

Ben Gottlieb