2016-07-29

UIWebView 自适应宽度,内容高度获取

做UIWebView开发的时候遇到html内容的宽度太宽与webView宽度不匹配的情况,虽然设置webView.scalesPageToFit = YES,但内容会被缩的非常小,要么居中缩小严重,要么偏的太厉害.如下图

未设置scalesPageToFit=YES前设置scalesPageToFit=YES后

HTML本身有一个缩放方法,可以在head里面添加一个节点:

< meta name=”viewport” content=”initial-scale=1.0, minimum-scale=0.1, maximum-scale=2.0, user-scalable=yes\”>

开始代码编写,第一次先加载一次HTML代码,用来获取webView的宽度,第一次先隐藏webView

初始化webView

第一次载入完成后，在代理里边调用js获取宽度，然后算出合适的缩放比例，并在里加上我们需要的，然后再将新的html重新加载，加载完成后再显示:

webView代理
根据比例设置宽度

根据个人需求,获取webView内容的高度,并赋值给webView:

webView内容高度获取

方便复制那段长长的代码

//获取内容实际高度（像素）
NSString * height_str= [webView stringByEvaluatingJavaScriptFromString: @”document.getElementById(‘webview_content_wrapper’).offsetHeight + parseInt(window.getComputedStyle(document.getElementsByTagName(‘body’)[0]).getPropertyValue(‘margin-top’)) + parseInt(window.getComputedStyle(document.getElementsByTagName(‘body’)[0]).getPropertyValue(‘margin-bottom’))”];