iOS 中JS和OC互调----UIWebView(进阶)
在上一篇博文我们已经讲了UIWebView的基础知识，这篇博文主要讲的知识点包含如下：
UIWebView设置
清空浏览器的cookies；
清除UIWebView的缓存；
网页刷新；
网页上一页和下一页；
网页加载的进度条，效果如qq和微信的网页加载进度条。
1 准备工作
前期的项目搭建和上一篇博文一样，只是在UINavigationController添加三个按钮。运行后的界面如图所示:
在图中有三个按钮，从左到右分别是刷新、后退和前进。
这里我使用的控制器为AdvancedVC。
#import"AdvancedVC.h"
@interfaceAdvancedVC()
@property(weak,nonatomic)IBOutletUIWebView*webView;///< UIWebView
@end
@implementationAdvancedVC
- (void)viewDidLoad {
[superviewDidLoad];
// Do any additional setup after loading the view.
}
@end
1.2 显示网页
我们使用大家都熟悉的百度做测试，加载网页“https://www.baidu.com”。
- (void)viewDidLoad {
[superviewDidLoad];
// Do any additional setup after loading the view.
NSURL*url = [NSURLURLWithString:@"https://www.baidu.com"];
NSURLRequest*urlRequest = [NSURLRequestrequestWithURL:url];
// url的位置
[self.webViewloadRequest:urlRequest];
// 加载页面
}
运行项目后，大家会发现一个错误。错误信息为
2.2 页面滚动弹跳
上面说的，你可以滑动到顶部看到背景色，这里有一个弹跳效果。也就是你看见背景色，松开手指看到的效果。这里你可以禁用这种效果。
self.webView.scrollView.bounces= NO;
2.3 缩放
默认情况下UIWebView加载HTML页面后，会以页面的原始大小进行显示，亦即如果页面的大小超出UIWebView视口大小，UIWebView会出现滚动效果，而且用户只能通过滚动页面来查看不同区域的内容，不能使用手指的捏合手势来放大或缩小页面。通过设置
self.webView.scalesPageToFit=YES；
UIWebView可以缩放HTML页面来适配其视口大小，从而达到整屏显示内容的效果，并且用户可以用捏合动作来放大或缩小页面来查看内容。
3 清空cookies
清空cookies使用到了NSHTTPCookieStorage类，这个类主要用于管理网络中的cookies。
在viewDidLoad方法中添加如下代码,这里我们清空了所有cookies。
4 清除缓存
清除UIWebView的缓存使用了NSURLCache对象，在这里我们使用removeAllCachedResponses清楚所有缓存。
5 网页刷新
在UIWebView有下列属性和方法。
、@property (nonatomic, readonly, getter=isLoading) BOOL loading、：是否正在刷新界面
- (void)reload：刷新
- (void)stopLoading：停止刷新
在AdvancedVC添加如下代码
6 网页上一页和下一页
在UIWebView有下列方法：
@property (nonatomic, readonly, getter=canGoBack) BOOL canGoBack：能否去上一页；
@property (nonatomic, readonly, getter=canGoForward) BOOL canGoForward：能否去下一页；
- (void)goBack：去上一页；
- (void)goForward：去下一页。
在AdvancedVC添加如下代码
7 进度条
打开qq的网页浏览，发现在UINavigationController有一个很炫的进度条，初步分析使用的是UIProgressView控件，这里我们也使用这种控件，只要实现进度条的动画效果即可。如果你想实现更炫的效果，请自行研究UIProgressView。
为了实现进度条，需要在界面中加一个UIProgressView控件。
在storyboard拉一个UIProgressView放在view上，并设置相关约束。搭建好后效果如图
然后将控件指向AdvancedVC，并实现UIVWebView的代理，完成后代码如下。
7.3 进度条实现
运行项目后，我们在浏览器随意操作。发现，有的页面输出信息多，有的页面输出信息少。
对比发现有的页面是请求多个url然后展示，而有的页面只请求一个url页面。
这就给我们实现进度条的机会，我们可以制作一个简单的进度条。由于webViewDidStartLoad和webViewDidFinishLoad是一一对应的，而且一个页面是并发的请求webViewDidStartLoad，然后再一个一个回调webViewDidFinishLoad。
通过这里你就发现了，只要完成的请求除以发出的请求就是进度条的百分比。
添加两个属性_startLoadingCount和_finishLoadingCount分别记录需加载和完成的请求，然后相除则完美实现进度条。
这里我只展示核心代码：
运行项目，进度条完美运行，是不是感觉很爽，你也会制作很炫的进度条了。但是这里我们制作的进度条是伪进度条，比较粗糙，虽然用户发现不了，但是我们自己还是知道。在UIWebView高级篇我会为大家介绍精度更高的进度条。
版权所有
