UIWebview 사용시 로딩 화면 추가 [IOS][Objective-C]

UIWebview 를 사용하여 iOS 앱 화면에 모바일웹 화면을 띄우는 방법은 간단합니다.

스토리 보드를 이용한 방법이 아래 링크에 잘 나와있습니다. 소스 코드만 봐도 간단하지요?

[참고] http://conecode.com/news/2011/05/ios-tutorial-creating-a-web-view-uiwebview/

- (void)viewDidLoad

{

    [super viewDidLoad];

    // Do any additional setup after loading the view.

    [self goToURL:@"https://mobile.twitter.com/waterstreetjr"];

}

// displays the URL

-(void)goToURL:(NSString*) fullURL{

    NSURL *url = [NSURL URLWithString:fullURL];

    NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];

    [_webView loadRequest:requestObj];

}

이렇게 UIWebview 를 만들고 나서...

1. 화면이 나오면 로딩이 끝날 때까지 흰색화면으로 남게 되는데요, 음.. 아래 그림처럼 로딩 이미지가 떠주면 어떨까 싶어서 추가해봤습니다.

#import <UIKit/UIKit.h>

@interface HomeViewController : UIViewController<UIWebViewDelegate>

{

     UIActivityIndicatorView* loadingIndicator;

}

@property (weak, nonatomic) IBOutlet UIWebView *webView;

@property (strong, nonatomic) UIActivityIndicatorView *loadingIndicator;

-(void)goToURL:(NSString*) fullURL;

@end

- (void)viewDidLoad

{

    [super viewDidLoad];

    // Do any additional setup after loading the view.

    [_webView setDelegate:self];

    [self addLoadingIndicatorToView];

    [self goToURL:@"https://mobile.twitter.com/waterstreetjr"];

}

// add loading indicator

-(void)addLoadingIndicatorToView{

    loadingIndicator= [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];

    [loadingIndicator setCenter:CGPointMake(self.view.frame.size.width/2, self.view.frame.size.height/2)];

    [self.view addSubview:loadingIndicator];

}

// displays the URL

-(void)goToURL:(NSString*) fullURL{

    NSURL *url = [NSURL URLWithString:fullURL];

    NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];

    [_webView loadRequest:requestObj];

}

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

    NSLog(@"webViewDidStartLoad");

    [loadingIndicator startAnimating];

}

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

    NSLog(@"webViewDidFinishLoad");

    [loadingIndicator stopAnimating];

}

- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error{

    NSLog(@"didFailLoadWithError");

}

동작이 잘 되는 부분은 확인 해 봤습니다. 

2) 로딩 화면이 보이지 않고, 로딩이 끝난 후에 보여지면 어떨까 생각해봤습니다. 예를 들면 테이블 뷰가 나오고 그 중에서 다음 화면이 웹뷰인 셀이 있습니다. 눌렀을 시 UIwebview 로 넘어갈 때 로딩이 끝난뒤 넘어가게 할 수도 있습니다.

[참고] http://www.neoos.ch/blog/43-three-useful-uiwebview-tweaks

넘어가기 전 테이블 뷰에서 다음 화면인 웹 뷰로 가는 셀을 터치 했을 경우, pushViewController 를 부르기 전에, 웹뷰 를 미리 로딩을 할 수 있도록 합니다.

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
  // check indexPath...
  myWebView = [[MyWebViewController alloc] init];
  myWebView.delegate = self;
  [myWebView preLoadView];
} 

웹뷰가 로딩이 끝나면 다음 화면으로 뷰가 넘어가게 됩니다.

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    [self.navigationController pushViewController:myWebView animated:YES];
    [myWebView release];