UIWebView: Показать изображение во время загрузки

Question

В моей раскадровке у меня есть представление с UIWebView, которое заполняет всю область, кроме вкладки и панели навигации.Контроллер для представления реализует протокол UIWebViewDelegate.Контроллер установлен как делегат для UIWebView:

#pragma mark - UIWebViewDelegate
- (void) webViewDidStartLoad:(UIWebView *)webView {
    NSLog(@"webViewDidStartLoad");
}

- (void) webViewDidFinishLoad:(UIWebView *)webView {
    NSLog(@"webViewDidFinishLoad");
}

Во время загрузки UIWebView я покажу черный фон с изображением, указывающим, что он загружается.Как я могу это сделать?

EDIT1: Я пытаюсь добавить значение по умолчанию ActivityIndicatorView вместо статического изображения.Но это просто дает мне черный фон с небольшой белой областью.В чем проблема?

UIImageView *loadingImageView = [[UIImageView alloc] initWithFrame:webView.frame];
UIActivityIndicatorView *spinner = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];
UIImage *spacer = [UIImage imageNamed:@"spacer"];    
UIGraphicsBeginImageContext(spinner.frame.size);
[spacer drawInRect:CGRectMake(0,0,spinner.frame.size.width,spinner.frame.size.height)];
UIImage* resizedSpacer = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
loadingImageView.image = resizedSpacer;
[loadingImageView setBackgroundColor:[UIColor blackColor]];
[loadingImageView setContentMode:UIViewContentModeCenter];
self.loadingImageView = loadingImageView;

Answer 1

В вашем контроллере .h

@property (nonatomic, retain) UIImageView *loadingImageView;

В вашем контроллере .m

@synthesize loadingImageView;

- (void)viewDidLoad {

    ...

    UIImageView *theLoadingImageView = [[UIImageView alloc] initWithFrame:webView.frame];
    theLoadingImageView.image = [UIImage imageNamed:@"your_image.png"];
    self.loadingImageView = theLoadingImageView;
    [theLoadingImageView release];

    ...
}

- (void) webViewDidStartLoad:(UIWebView *)webView {

    [self.view addSubview:self.loadingImageView];
}

- (void) webViewDidFinishLoad:(UIWebView *)webView {

    [self.loadingImageView removeFromSuperview];
}

РЕДАКТ. 1:

Если вы хотитечтобы показать ActivityIndicatorView вместо статического изображения, вот небольшой вспомогательный класс, который я люблю использовать:

LoadingIndicator.h

#import <UIKit/UIKit.h>


@interface LoadingIndicator : UIView {

    UIActivityIndicatorView *activityIndicator;
    UILabel *labelMessage;

}

@property(retain) UIActivityIndicatorView *activityIndicator;
@property(retain) UILabel *labelMessage;

- (id)init;
- (void)show:(NSString *)theMessage;
- (void)hide;
- (void)refreshPosition;

@end

LoadingIndicator.m

#import "LoadingIndicator.h"
#import <QuartzCore/QuartzCore.h>

@implementation LoadingIndicator

@synthesize labelMessage, activityIndicator;

- (id)init {    
    if (self = [super initWithFrame:CGRectMake(25, 130, 270, 100)]) {

        // Vue
        self.backgroundColor = [UIColor blackColor];
        self.alpha = 0.80;
        self.layer.cornerRadius = 5;

        // Label : message
        UILabel *theLabelMessage = [[UILabel alloc] initWithFrame:CGRectMake(15, 65, 240, 20)];
        theLabelMessage.backgroundColor = [UIColor clearColor];
        theLabelMessage.textColor = [UIColor whiteColor];
        theLabelMessage.text = NSLocalizedString(@"Loading", @"Loading");
        theLabelMessage.textAlignment = UITextAlignmentCenter;
        theLabelMessage.font = [UIFont boldSystemFontOfSize:16];
        theLabelMessage.adjustsFontSizeToFitWidth = YES;

        self.labelMessage = theLabelMessage;
        [self addSubview:theLabelMessage];
        [theLabelMessage release];

        // Activity Indicator
        UIActivityIndicatorView *theActivityIndicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];
        theActivityIndicator.frame = CGRectMake(115, 15, 40, 40);

        self.activityIndicator = theActivityIndicator;
        [self addSubview:theActivityIndicator];
        [theActivityIndicator release];

    }
    return self;
}

- (void)show:(NSString *)theMessage {

    self.labelMessage.text = theMessage;
    [self.activityIndicator startAnimating];
    self.hidden = NO;
    [self.superview bringSubviewToFront:self];
        [self refreshPosition];
}

- (void)hide {
    [self.activityIndicator stopAnimating];
    self.hidden = YES;
}

- (void)refreshPosition {

    self.center = self.superview.center;
}

- (void)dealloc {
    self.labelMessage = nil;
    self.activityIndicator = nil;

    [super dealloc];
}

@end

Затем в вашем представлении. h

#import <UIKit/UIKit.h>
#import "LoadingIndicator.h"


@interface YourView : UIView {

    LoadingIndicator *loadingIndicator;

}

@property(retain) LoadingIndicator *loadingIndicator;

- (void)showLoadingIndicator:(NSString *)theMessage;
- (void)hideLoadingIndicator;

@end

В вашем представлении. m

#import "YourView.h"


@implementation YourView

@synthesize loadingIndicator;


- (id)initWithFrame:(CGRect)frame {
    if ((self = [super initWithFrame:frame])) {

        ...

        // Add your UIWebView etc

        ...

        // Loading Indicator
        LoadingIndicator *theLoadingIndicator = [[LoadingIndicator alloc] init];
        theLoadingIndicator.hidden = YES;   // Hidden by default

        self.loadingIndicator = theLoadingIndicator;
        [self addSubview:theLoadingIndicator];
        [theLoadingIndicator release];

        ...


    }
    return self;
}

- (void)showLoadingIndicator:(NSString *)theMessage {
    NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];

    [self.loadingIndicator performSelectorOnMainThread:@selector(show:) withObject:theMessage waitUntilDone:NO];

    [pool release];
}

- (void)hideLoadingIndicator {
    NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];

    [self.loadingIndicator performSelectorOnMainThread:@selector(hide) withObject:nil waitUntilDone:NO];

    [pool release];
}

- (void)dealloc {
    self.loadingIndicator = nil;

    [super dealloc];
}


@end

Наконец, в вашем делегате WebView:

- (void) webViewDidStartLoad:(UIWebView *)webView {

    [(YourView *)self.view showLoadingIndicator:@"Loading"];
}

- (void) webViewDidFinishLoad:(UIWebView *)webView {

    [(YourView *)self.view hideLoadingIndicator];
}

Это будет выглядеть примерно так:

Answer 2

Вы просто скрываете и отображаете загрузочное изображение, содержащее нужное сообщение, в методах UIWebViewDelegate.

- (void)viewDidLoad {

    [super viewDidLoad];

    loadingView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"loading image.png"]];

    loadingView.center = CGPointMake(x, y);

    [webView addSubview:loadingView];

}

- (void)webViewDidFinishLoad:(UIWebView *)webView1

{
    loadingView.hidden = YES;

}


- (void)webViewDidStartLoad:(UIWebView *)webView1

{

    loadingView.hidden = NO;

}