前言
仔细研究了一下项目, 项目中有很多地方都会用到网页来展示界面, 所以, 提前研究一下UIWebView和WKWebView. 让自己在使用的过程中尽量少走一些弯路. 本章主要介绍UIWebView, 至于WKWebView将会留到下一章重点介绍.
UIWebView的原理:
- UIWebView加载内容的三种方式:
- 方式一: - (void)loadRequest:(NSURLRequest *)request;
UIWebView *webView = [[UIWebView alloc] initWithFrame:self.view.bounds];
webView.delegate = self;
NSURL *url = [NSURL URLWithString:@"http://www.baidu.com"];
NSURLRequest *request = [NSURLRequest requestWithURL:url];
- 方式二: - (void)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL;
// 加载本地的html文件的两种常见方法:
方法1:
NSString *resourcePath = [ [NSBundle mainBundle] resourcePath];
NSString *filePath = [resourcePath stringByAppendingPathComponent:@"text.html"];
NSString *htmlstring =[[NSString alloc] initWithContentsOfFile:filePath encoding:NSUTF8StringEncoding error:nil];
[self.webView loadHTMLString:htmlstring baseURL:[NSURL fileURLWithPath: [[NSBundle mainBundle] bundlePath]]];
方法2:
- (void)loadData:(NSData *)data MIMEType:(NSString *) MIMEType textEncodingName:(NSString *)textEncodingName baseURL:(NSURL *)baseURL;
- 注意:
webView加载本地文件可以使用加载数据的方式.
1. NSData 本地文件对应的数据
2. MIMEType
3. 编码格式字符串
4. 相对地址，一般加载本地文件不使用，可以在指定的baseURL中查找相关文件
如果要用UIWebView显示对应的文件，必须知道准确的MIMEType
但是，不是所有格式的文件都可以通过本地数据的方式加载，即便是知 道MIMEType
-
UIWebView的优劣势
- 优势: UIWebView可以跨平台使用, 并且只要审批过后, 以后就不需要审批了, 以后只需要在后台维护即可.
劣势: 性能不好, 不能使用手势等方法.
在开发中经常会用到的方法
// 三个加载UIWebView的方法
loadRequest:
loadHTMLString:baseURL:
loadData:MIMEType:textEncodingName:baseURL:
// 常用到的导航方法
goBack: 表示回退到上一页
goForward: 表示前进到下一页
reload: 表示重载
stopLoading: 表示取消载入内容
// 常见属性
// 自动对页面进行缩放, 主要目的是适应不同屏幕
webView.scalesPageToFit = YES;
dataDetectorTypes - 设定电话号码、网址、电子邮件和日期等文字变为链接文字
// 自动检测页面上的特殊功能
UIDataDetectorTypePhoneNumber 检测手机号, 点击可以打电话
UIDataDetectorTypeLink 检测页面上的链接, 点击有响应
UIDataDetectorTypeAddress
UIDataDetectorTypeNone 不用检测
UIDataDetectorTypeAll 检测所有
webView.dataDetectorTypes = UIDataDetectorTypeAll;
浏览器通过MIME标志符可以知道使用哪种插件读取相关文件
iOS可以直接调用js代码与页面通讯
注意: 值得注意的一点: UIWebView协议中的方法, 第一个参数都是指向了webView的一个指针, 所以我们可以使用一个代理用于多个网页
代理方法
代理方法一:
//当网页视图被指示载入内容而得到通知。应当返回YES，这样会进行加载。通过导航类型参数可以得到请求发起的原因，可以是以下任意值：
UIWebViewNavigationTypeLinkClicked
UIWebViewNavigationTypeFormSubmitted
UIWebViewNavigationTypeBackForward
UIWebViewNavigationTypeReload
UIWebViewNavigationTypeFormResubmitted
UIWebViewNavigationTypeOther
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
return YES;
}
代理方法二:
// 当网页已经加载一个内容以后, 就会得到通知, 调用该方法
- (void)webViewDidStartLoad:(UIWebView *)webView
{
// [webView stopLoading]; // 表示取消继续载入内容
}
代理方法三:
-(void)webViewDidFinishLoad:(UIWebView*)webView ;//当网页视图结束加载一个请求之后，得到通知。
代理方法四:
-(void)webView:(UIWebView*)webView DidFailLoadWithError:(NSError*)error;//当在请求加载中发生错误时，得到通知。会提供一个NSSError对象，以标识所发生错误类型。
iOS开发中使用UIWebView时需要注意的几点:
1, 与UIWebView进行交互, 调用web页面需要传参的函数时, 参数需要带单引号或者双引号(双引号需要进行转义字符), 但是, 在传Json字符串的时候是不需要带单引号或者双引号的.
2, 只有WebView加载完毕之后, 才能调用页面中对应的JS方法
3, 如果载入的内容布局大于了手机尺寸, 可以通过webView.scalesPageToFit = YES;来适应手机尺寸
常见例子
- demo1: 加载网页
UIWebView *webView = [[UIWebView alloc] initWithFrame:self.view.bounds];
webView.delegate = self;
NSURL *url = [NSURL URLWithString:@"http://www.baidu.com"];
NSURLRequest *request = [NSURLRequest requestWithURL:url];
- demo2: 加载html字符串
// HTML5
// 直接加载HTML字符串，完整的html
NSString *str = @"<html><head><title>Hello</title></head><body><h1>Hello</h1><ul><li>123</li><li>321</li><li>1234567</li></ul></body></html>";
// 部分html
NSString *str1 = @"<h1>Hello</h1><ul><li>123</li><li>321</li><li>1234567</li></ul>";
[self.webView loadHTMLString:str1 baseURL:nil];
- demo3: 加载pdf文件
NSString *path = [[NSBundle mainBundle]pathForResource:@"iOS7Cookbook.pdf" ofType:nil];
NSURL *url = [NSURL fileURLWithPath:path];
NSLog(@"%@", [self mimeType:url]);
// 以二进制数据的形式加载沙箱中的文件
NSData *data = [NSData dataWithContentsOfFile:path];
[self.webView loadData:data MIMEType:@"application/pdf" textEncodingName:@"UTF-8" baseURL:nil];
- demo4: 导航
#pragma mark 后退
- (void)goBack
{
NSLog(@"后退");
[self.webView goBack];
}
#pragma mark 前进
- (void)goForward
{
NSLog(@"前进");
[self.webView goForward];
}
#pragma mark 刷新
- (void)refresh
{
NSLog(@"刷新");
[self.webView reload];
}
- demo5: UIWebView调用JS
// 获取当前页面的url
NSString *url = [_webView stringByEvaluatingJavaScriptFromString:@"document.location.href"];
NSLog(@"url %@", url);
// 获取当前页面的标题
NSString *title = [_webView stringByEvaluatingJavaScriptFromString:@"document.title"];
NSLog(@"title %@", title);
// 提交表单
[_webView stringByEvaluatingJavaScriptFromString:@"document.forms[0].submit(); "];
- 修改UIWebView中的字体相关
// 1,
- (void)webViewDidFinishLoad:(UIWebView *)webView方法中加入js代码
NSString *str = @"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '60%'";
[_webView stringByEvaluatingJavaScriptFromString:str];
// 2,
NSString *jsString = [[NSString alloc] initWithFormat:@"document.body.style.fontSize=%f;document.body.style.color=%@",fontSize,fontColor];
[webView stringByEvaluatingJavaScriptFromString:jsString];
// 3,
NSString *js_fit_code = [NSString stringWithFormat:@"var meta = document.createElement('meta');"
"meta.name = 'viewport';"
"meta.content = 'width=%f, initial-scale=%f, minimum-scale=0.1,maximum-scale=1.0, user-scalable=yes';"
"document.getElementsByTagName('head')[0].appendChild(meta);",_webView.frame.size.width,_webView.frame.size.width/1000];
[_webView setScalesPageToFit:YES];
}
关于html的拓展(调用js)
原文地址: http://blog.csdn.net/duzixi/article/details/36047201
UIWebView的缓存问题
原文地址: https://github.com/slipawayleaon/iOS-UIWebView-LocalCache
