Creating a "loading..." view using iPhone SDK - iphone

Question

How to create that black/gray modal popup kind of view that many apps use, when some long pending operation is in progress?
Like when using location based services, loading a webpage, the screen goes dim and there is a modal view showing a spinning icon "Please wait..."
Example in the following screenshot:

Answer 1

This is actually the undocumented (in 2.2.1 anyway) UIProgressHUD. Create one like this:
In your .h:
#interface UIProgressHUD : NSObject
- (UIProgressHUD *) initWithWindow: (UIView*)aWindow;
- (void) show: (BOOL)aShow;
- (void) setText: (NSString*)aText;
#end
In your .m:
- (void) killHUD: (id)aHUD
{
[aHUD show:NO];
[aHUD release];
}
- (void) presentSheet
{
id HUD = [[UIProgressHUD alloc] initWithWindow:[contentView superview]];
[HUD setText:#"Doing something slow. Please wait."];
[HUD show:YES];
[self performSelector:#selector(killHUD:) withObject:HUD afterDelay:5.0];
}

Answer 2

If you want to avoid undocumented api you can also take a look at MBProgressHUD. It's similar to UIProgressHUD and even has some additional features.

Answer 3

I think the simplest (a few lines of code), fully documented and most beautiful way is to use the UIAlertView with a UIActivityIndicatorView:
http://iosdevelopertips.com/user-interface/uialertview-without-buttons-please-wait-dialog.html
(source: iosdevelopertips.com)

Answer 4

If you add a UIView as a subview of the main window it will cover the entire UI. Make it partially transparent and partially translucent and it will look like a popup.
This example shows how to fade the Default.png splash screen, starting with that it's pretty straightforward to add a couple methods to your application delegate (that has a pointer to the main window) to present and dismiss the progress view.

Answer 5

Take a look at the Wordpress iPhone app (http://iphone.wordpress.org/) for an example of how to do this without using any undocumented API's.

Answer 6

I use LoadingHUDView for this purpose, and it works always.
get LoadingHUDView.m and LoadingHUDView.h and do the following in your base class (or whatever)
#pragma mark ActivityIndicator Methods
-(void) showModalActivityIndicator:(NSString *)message
{
loadingView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 480)]retain];// origional
//loadingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 480)]; //testing
loadingView.backgroundColor = [UIColor grayColor]; //[UIColor colorWithRed:1 green:1 blue:1 alpha:0.3];
LoadingHUDView *loadHud = [[LoadingHUDView alloc] initWithTitle:message];
loadHud.center = CGPointMake(160, 290);
[loadingView addSubview:loadHud];
[loadHud startAnimating];
[loadHud release];
[loadingView setAlpha:0.0];
[self.tableView addSubview:loadingView];
[UIView beginAnimations:#"fadeOutSync" context:NULL];
[UIView setAnimationDelegate:self];
[UIView setAnimationDuration:0.5];
[loadingView setAlpha:0.5];
[UIView commitAnimations];
}
-(void) hideModalActivityIndicator {
if (loadingView) {
[UIView beginAnimations:#"fadeOutSync" context:NULL];
[UIView setAnimationDidStopSelector:#selector (removeTranparentView) ];
[UIView setAnimationDelegate:self];
[UIView setAnimationDuration:0.5];
[loadingView setAlpha:0];
[UIView commitAnimations];
}
}
-(void)removeTranparentView
{
[loadingView removeFromSuperview];
[loadingView release];
loadingView = nil;
}
HOPE THIS HELPS.
thank you

Answer 7

In XIB file, place UIView and UIActivityIndicatorView.
Set ActivityIndicatorView Property SetAnimated to Yes.
#property (retain, nonatomic) IBOutlet UIView* m_LoadingView;
While Starting long operations, Add the LoadingView to the view
m_LoadingView.layer.cornerRadius = 10;
m_LoadingView.center = self.view.center;
[self.view addSubview:m_LoadingView];
After completing the process, Remove LoadingView from super view.
[m_LoadingView removeFromSuperView];