博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
iOS项目之WKWebView替换UIWebView相关
阅读量:4708 次
发布时间:2019-06-10

本文共 6320 字,大约阅读时间需要 21 分钟。

        在网上已经有了许多关于UIWebView替换为WKWebView的文章,所以在这里就不在多说替换的细节了,不会的可以在网上搜搜。

        下面是我在项目中遇到的问题:

问题一:在UIWebView中,网页显示(包括图片显示)比例正常,替换为WKWebView后,比例显示不正常

解决方案:直接上代码

/* 在创建WKWebView的时候,配置环境中添加下面的js语句,可以使界面自适应屏幕 */        // 自适应屏幕宽度js        NSString *jSString = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);";                WKUserScript *wkUserScript = [[WKUserScript alloc] initWithSource:jSString injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES];        // 自定义配置,一般用于js调用oc方法(oc拦截URL中的数据做自定义操作)        WKUserContentController *userContentController = [[WKUserContentController alloc] init];        [userContentController addUserScript:wkUserScript];

        解决图片显示比例的代码在我的另外一篇文章中写到过,这里就不再写了。

问题二:将webView添加到cell的contentView中,UIWebView创建的界面能够展示完整,而WKWebView创建的界面只能够展示一部分

分析:此时出现的白屏问题,详细分析可以去看看这位大神写的简书(WKWebView刷新机制小探):http://www.jianshu.com/p/1d739e2e7ed2,地址已附上。

解决方案:在cell的contentView中添加自定义的scrollView,然后再将WKWebView创建的webView添加到这个scrollView中,就能解决此类白屏问题。

部分代码附上:

@interface WebCell ()
@property(nonatomic, weak) UIScrollView *webScrollView;@property(nonatomic, weak) WKWebView *webView;@end@implementation WebCell- (UIScrollView *)webScrollView{ if (!_webScrollView) { UIScrollView *sv = [[UIScrollView alloc] init]; [self.contentView addSubview:sv]; _webScrollView = sv; } return _webScrollView;}- (WKWebView *)webView{ if (!_webView) { // 配置环境 WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init]; // 自适应屏幕宽度js NSString *jSString = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);"; WKUserScript *wkUserScript = [[WKUserScript alloc] initWithSource:jSString injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES]; // 允许视频播放 if (iOS_Version(9.0)) { configuration.allowsAirPlayForMediaPlayback = YES; } // 允许在线播放 configuration.allowsInlineMediaPlayback = YES; // 允许与网页交互 configuration.selectionGranularity = YES; // 内容处理池 configuration.processPool = [[WKProcessPool alloc] init]; // 自定义配置,一般用于js调用oc方法(oc拦截URL中的数据做自定义操作) WKUserContentController *userContentController = [[WKUserContentController alloc] init]; // 添加消息处理,注意:self指代的对象需要遵守WKScriptMessageHandler协议,结束时需要移除 [userContentController addScriptMessageHandler:self name:@"Handle"]; [userContentController addUserScript:wkUserScript]; // 是否支持记忆读取 configuration.suppressesIncrementalRendering = YES; // 允许用户更改网页的设置 configuration.userContentController = userContentController; // 创建wk WKWebView *wv = [[WKWebView alloc] initWithFrame:CGRectZero configuration:configuration]; // 设置背景色 wv.backgroundColor = [UIColor clearColor]; wv.opaque = NO; // 设置代理 wv.navigationDelegate = self; wv.UIDelegate = self; // 网页内容禁用滑动 wv.scrollView.scrollEnabled = NO; // kvo添加进度监控// [wv addObserver:self forKeyPath:NSStringFromSelector(@selector(estimatedProgress)) options:0 context:nil]; // 开启手势触摸 wv.allowsBackForwardNavigationGestures = YES; // 自适应 [wv sizeToFit]; [self.webScrollView addSubview:wv]; _webView = wv; } return _webView;}#pragma mark -
<设置数据>
- (void)setModel:(Model *)model{ _model = model; // 手动改变图片适配问题,拼接html代码后,再加载html代码 NSString *myStr = [NSString stringWithFormat:@"
", SCREEN_WIDTH - 20]; NSString *str = [NSString stringWithFormat:@"%@%@",myStr, model.htmlStr]; [self.webView loadHTMLString:str baseURL:nil];}#pragma mark -
<界面布局>
- (void)layoutSubviews{ [super layoutSubviews]; [self.webView mas_makeConstraints:^(MASConstraintMaker *make) { make.top.bottom.left.right.mas_equalTo(self.contentView); }];}#pragma mark -
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{ [webView evaluateJavaScript:@"document.body.scrollHeight" completionHandler:^(id _Nullable response, NSError * _Nullable error) { // 获取webView的高度 CGFloat webViewHeight = [response floatValue]; // 设置自定义scrollView的frame self.webScrollView.frame = CGRectMake(0, 0, SCREEN_WIDTH, webViewHeight); // 通过代理方法,刷新表格高度 if ([self.delegate respondsToSelector:@selector(webViewWithChangeHeight:)]) { [self.delegate webViewWithChangeHeight:webViewHeight]; } }];}- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{}- (void)dealloc{ [self.webView.configuration.userContentController removeScriptMessageHandlerForName:@"Handle"];}@end

 问题三:webView中有捏合手势,往往在项目中我们不需要这个手势,则看下面的js代码

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{    // 禁用网页捏合手势    NSString *injectionJSString = @"var script = document.createElement('meta');"    "script.name = 'viewport';"    "script.content=\"width=device-width, initial-scale=1.0,maximum-scale=1.0, minimum-scale=1.0, user-scalable=no\";"    "document.getElementsByTagName('head')[0].appendChild(script);";    [webView evaluateJavaScript:injectionJSString completionHandler:nil];}

问题四:如果在webView中,需要点击网页中的图片查看大图时,则看下面的js代码

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{    //这里是js,主要目的实现对url的获取    static  NSString * const jsGetImages =    @"function getImages(){\    var objs = document.getElementsByTagName(\"img\");\    var imgScr = '';\    for(var i=0;i
= 2) { [_mUrlArray removeLastObject]; } //urlResurlt 就是获取到得所有图片的url的拼接;_mUrlArray就是所有Url的数组 }]; //添加图片可点击js static NSString * const jsImageClick = @"function registerImageClickAction(){\ var imgs=document.getElementsByTagName('img');\ var length=imgs.length;\ for(var i=0;i

 

希望以上能帮助更多需要帮助的人,如果有疑问,也希望大神能多多给小弟提意见和建议。

 

转载于:https://www.cnblogs.com/sjxjjx/p/6439016.html

你可能感兴趣的文章
索引的分类--B-Tree索引和Hash索引
查看>>
Python学习笔记——参数axis=0,1,2...
查看>>
kivy学习三:打包成window可执行文件
查看>>
兄弟连PHP培训教你提升效率的20个要点
查看>>
【快报】基于K2 BPM的新一代协同办公门户实践交流会
查看>>
关于MySQL的行转列的简单应用
查看>>
Queue 队列的用法
查看>>
CDM常用命令
查看>>
游戏开发中常用的设计模式
查看>>
Linux 中/etc/profile、~/.bash_profile 环境变量配置及执行过程
查看>>
JAVA:图形之利用FontMetrics类居中
查看>>
使用rsync同步目录
查看>>
[读码时间] for循环遍历设置所有DIV块元素背景色为红色
查看>>
网页调用迅雷下载文件
查看>>
Python 调用 Shell命令
查看>>
POJ 1159 Palindrome(最长公共子序列)
查看>>
责任链模式(chain of responsibility)
查看>>
[转载]java多线程学习-java.util.concurrent详解(一) Latch/Barrier
查看>>
ionic - 运行起来
查看>>
Shell 输入/输出重定向
查看>>