UIWebViewの上にインジケーターを表示させる
- 2013年02月20日
- iOSアプリ開発
こちらのサイトを参考にさせて頂きました。
さくらのあたま: iphoneアプリ UIWebviewを呼び出しながら、UIActivityIndicatorViewを表示する方法
ほぼコピペしたのですが、インジケーターが見辛かったので、半透明のグレーの四角形の中にインジケータを表示させることにしました。
interface部分にUIViewを追加しました。
UIView * indicatorBackView; UIActivityIndicatorView * indicator;
実装部分はこちら
(layerを使っているのでQuartzCore.hのインポートが必要)
#import// ..... - (void)viewDidLoad // .... // webViewの設置などをここまでに行っておいて // 以下インジケーターの設置部分のみ indicatorBackView = [[UIView alloc] initWithFrame:CGRectMake((self.view.bounds.size.width/2)-50, (self.view.bounds.size.height/2)-60, 100, 100)]; indicatorBackView.backgroundColor = [UIColor grayColor]; indicatorBackView.alpha = 0.5; [[indicatorBackView layer] setCornerRadius:5.0]; [self.view addSubview:indicatorBackView]; indicator = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge]; indicator.frame = CGRectMake(indicatorBackView.bounds.size.width/2-20,indicatorBackView.bounds.size.height/2-20,40,40); [indicatorBackView addSubview:indicator]; } //WEBの読み込みを開始したら - (void)webViewDidStartLoad:(UIWebView*)aWebView { //インジケーターの表示 indicatorBackView.hidden = NO; [indicator startAnimating]; [UIApplication sharedApplication].networkActivityIndicatorVisible = YES; } //WEBの読み込み成功したら - (void)webViewDidFinishLoad:(UIWebView*)aWebView { //インジケーターの非表示 [indicator stopAnimating]; indicatorBackView.hidden = YES; [UIApplication sharedApplication].networkActivityIndicatorVisible = NO; } //WEBの読み込みに失敗したら - (void)webView:(UIWebView*)aWebView didFailLoadWithError:(NSError*)error { //インジケーターの非表示 [indicator stopAnimating]; indicatorBackView.hidden = YES; }
のようにしました。
実行すると、ページ読み込み時にはこのように表示されます。