UIWebView是iOS sdk中一个最常用的控件。是内置的浏览器控件,我们可以用它来浏览网页、打开文档等等。大家先看一个简单的例子,做一个简易的浏览器。如下图:
我们创建一个Window-based Application程序命名为:UIWebViewDemo
UIWebView的loadRequest可以用来加载一个url地址,它需要一个NSURLRequest参数。我们定义一个方法用来加载url。在UIWebViewDemoViewController中定义下面方法:
- (void)loadWebPageWithString:(NSString*)urlString
{
NSURL *url =[NSURL URLWithString:urlString];
NSLog(urlString);
NSURLRequest *request =[NSURLRequest requestWithURL:url];
[webView loadRequest:request];
}
在界面上放置3个控件,一个textfield、一个button、一个uiwebview,布局如下:
在代码中定义相关的控件:webView用于展示网页、textField用于地址栏、activityIndicatorView用于加载的动画、buttonPress用于按钮的点击事件。
@interface UIWebViewDemoViewController :UIViewController<UIWebViewDelegate> {
IBOutlet UIWebView *webView;
IBOutlet UITextField *textField;
UIActivityIndicatorView *activityIndicatorView;
}
- (IBAction)buttonPress:(id) sender;
- (void)loadWebPageWithString:(NSString*)urlString;
@end
使用IB关联他们。
设置UIWebView,初始化UIActivityIndicatorView:
- (void)viewDidLoad
{
[super viewDidLoad];
webView.scalesPageToFit =YES;
webView.delegate =self;
activityIndicatorView = [[UIActivityIndicatorView alloc]
initWithFrame : CGRectMake(0.0f, 0.0f, 32.0f, 32.0f)] ;
[activityIndicatorView setCenter: self.view.center] ;
[activityIndicatorView setActivityIndicatorViewStyle: UIActivityIndicatorViewStyleWhite] ;
[self.view addSubview : activityIndicatorView] ;
[self buttonPress:nil];
// Do any additional setup after loading the view from its nib.
}
UIWebView主要有下面几个委托方法:
1、- (void)webViewDidStartLoad:(UIWebView *)webView;开始加载的时候执行该方法。
2、- (void)webViewDidFinishLoad:(UIWebView *)webView;加载完成的时候执行该方法。
3、- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error;加载出错的时候执行该方法。
我们可以将activityIndicatorView放置到前面两个委托方法中。
- (void)webViewDidStartLoad:(UIWebView *)webView
{
[activityIndicatorView startAnimating] ;
}
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
[activityIndicatorView stopAnimating];
}
buttonPress方法很简单,调用我们开始定义好的loadWebPageWithString方法就行了:
- (IBAction)buttonPress:(id) sender
{
[textField resignFirstResponder];
[self loadWebPageWithString:textField.text];
}
当请求页面出现错误的时候,我们给予提示:
- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error
{
UIAlertView *alterview = [[UIAlertView alloc] initWithTitle:@"" message:[error localizedDescription] delegate:nil cancelButtonTitle:nil otherButtonTitles:@"OK", nil];
[alterview show];
[alterview release];
}
总结:本文通过实现一个简单的浏览器,说明了uiwebview的方法和属性,相信通过这个例子,应该明白uiwebview的使用了。
UIWebView的几个小技巧
一. 在UIWebView中使用flashScrollIndicators
使用UIScrollView时,我们可以使用flashScrollIndicators方法显示滚动标识然后消失,告知用户此页面可以滚动,后面还有更多内容。UIWebView内部依赖于UIScrollView,但是其没有flashScrollIndicators方法,但可以通过其他途径使用此方法,如下所示。
for (id subView in [webView subviews]) { if ([subView respondsToSelector:@selector(flashScrollIndicators)]) { [subView flashScrollIndicators]; } }
上述代码片段可以到webViewDidFinishLoad回调中使用,加载完网页内容后flash显示滚动标识。
二.去除UIWebView的背景阴影
假设一个UIWebView是白底黑字的,当用户拖动UIWebView时,会看到后面的背景阴影。可以使用下述代码去除阴影,并将背景设为白色。
if ([[webView subviews] count] > 0) { // hide the shadows for (UIView* shadowView in [[[webView subviews] objectAtIndex:0] subviews]) { [shadowView setHidden:YES]; } // show the content [[[[[webView subviews] objectAtIndex:0] subviews] lastObject] setHidden:NO]; } webView.backgroundColor = [UIColor whiteColor];
三.根据内容获取UIWebView的高度
有时候需要根据不同的内容调整UIWebView的高度,以使UIWebView刚好装下所有内容,不用拖动,后面也不会留白。有两种方式可根据加载内容获取UIWebView的合适高度,但都需要在网页内容加载完成后才可以,即需要在webViewDidFinishLoad回调中使用。
1.使用sizeThatFits方法。
- (void)webViewDidFinishLoad:(UIWebView *)webView { CGRect frame = webView.frame; frame.size.height = 1; webView.frame = frame; CGSize fittingSize = [webView sizeThatFits:CGSizeZero]; frame.size = fittingSize; webView.frame = frame; }
sizeThatFits方法有个问题,如果当前UIView的大小比刚好合适的大小还大,则返回当前的大小,不会返回最合适的大小值,所以使用sizeThatFits前,先将UIWebView的高度设为最小,即1,然后再使用sizeThatFits就会返回刚好合适的大小。
2.使用JavaScript
- (void)webViewDidFinishLoad:(UIWebView *)webView { CGRect frame = webView.frame; NSString *fitHeight = [webview stringByEvaluatingJavaScriptFromString:@"document.body.scrollHeight;"]; frame.size.height = [fitHeight floatValue]; webView.frame = frame; }
使用UIWebView的stringByEvaluatingJavaScriptFromString方法,执行JavaScript语句document.body.scrollHeight;可获取当前网页正文的全文高,测试时曾错误的使用了document.body.offsetHeight。
3.限制
这两种方法都只能在加载网页完成时才能使用,当在UITableView中的UITableViewCell包含UIWebView时,无法在tableView:heightForRowAtIndexPath:中获取到UIWebView最合适的高度,也就无法确定UITableViewCell的合适高度。
第一种方法:使用UIView and UIActivityIndicatorView
//创建UIWebView
WebView =[[UIWebView alloc]initWithFrame:CGRectMake(0, 44, 320, 400)];
[WebView setUserInteractionEnabled:NO];
[WebView setBackgroundColor:[UIColor clearColor]];
[WebView setDelegate:self];
[WebView setOpaque:NO];//使网页透明
NSString*path= @"http://www.baidu.com";
NSURL*url=[NSURLURLWithString:path];
[WebView loadRequest:[NSURLRequestrequestWithURL:url]];
//创建UIActivityIndicatorView背底半透明View
UIView *view=[[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 480)];
[viewsetTag:103];
[viewsetBackgroundColor:[UIColor blackColor]];
[viewsetAlpha:0.8];
[self.viewaddSubview:view];
activityIndicator =[[UIActivityIndicatorView alloc]initWithFrame:CGRectMake(0.0f, 0.0f, 32.0f, 32.0f)];
[activityIndicator setCenter:view.center];
[activityIndicator setActivityIndicatorViewStyle:UIActivityIndicatorViewStyleWhite];
[viewaddSubview:activityIndicator];
[self.viewaddSubview:WebView];
[viewrelease];
[WebView release];
//开始加载数据
-(void)webViewDidStartLoad:(UIWebView *)webView {
[activityIndicator startAnimating];
}
//数据加载完
-(void)webViewDidFinishLoad:(UIWebView *)webView {
[activityIndicator stopAnimating];
UIView *view=(UIView *)[self.viewviewWithTag:103];
[viewremoveFromSuperview];
}
第二种方法:使用UIAlertView and UIActivityIndicatorView
//加载网页动画
-(void)webViewDidStartLoad:(UIWebView *)webView{
if(myAlert==nil){
myAlert =[[UIAlertView alloc]initWithTitle:nil
message: @"正在讀取網路資料"delegate:self
cancelButtonTitle:nil
otherButtonTitles:nil];
UIActivityIndicatorView *activityView =[[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhite];
activityView.frame= CGRectMake(120.f, 48.0f, 37.0f, 37.0f);
[myAlert addSubview:activityView];
[activityView startAnimating];
[myAlert show];
}
}
-(void)webViewDidFinishLoad:(UIWebView *)webView{
[myAlert dismissWithClickedButtonIndex:0 animated:YES];
}
/*=======================================*/
用法一:只显示不停旋转的进度滚轮指示器。
//显示进度滚轮指示器
-(void)showWaiting
progressInd=[[UIActivityIndicatorView alloc]initWithActivityIndicato
progressInd.center=CGPointMake(self.view.center.x,240);
[self.navigationController.view addSubview:progressInd];
[progressInd startAnimating];
}
//消除滚动轮指示器
-(void)hideWaiting
{
[progressInd stopAnimating];
}
用法二:带有半透明背景的进度轮指示器。
//显示进度滚轮指示器
-(void)showWaiting:(UIView *)parent {
frame = CGRectMake((x - 70)/2, (y - height) / 2 + height, 80, 20);
UILabel *waitingLable = [[UILabel alloc] initWithFrame:frame];
waitingLable.text = @"Loading...";
waitingLable.textColor = [UIColor whiteColor];
waitingLable.font = [UIFont systemFontOfSize:15];
waitingLable.backgroundColor = [UIColor clearColor];
[theView addSubview:waitingLable];
[waitingLable release];
}
//消除滚动轮指示器
-(void)hideWaiting
{
}
关于UIWebView的高度问题
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
}